Nu se poate injecta dependența ngMaterial (Programare, Javascript, Angularjs, Angularjs 1.6, Angularjs Material)

student1868 a intrebat.

Caut să dezvolt o aplicație care utilizează atât dirPagination, cât și AngularJS material. Cu toate acestea, nu reușesc să injectez dependența ngMaterial dependență în aplicația mea. Adresa angularUtils.directives.dirPagination dependență funcționează bine, dar de îndată ce adaug ngMaterial, aplicația AngularJS se blochează.

Iată un Plunker cu un exemplu (https://plnkr.co/edit/7N7i9TnMc77Nz6xlNhuk?p=preview). În app.js, care este locul în care instanțiez modulul, ambele dependențe sunt acolo. În cazul în care linia se citește:

angular.module('myApp', ['angularUtils.directives.dirPagination', 'ngMaterial']);

Atunci AngularJS se blochează și pagina arată {{hello}}. Cu toate acestea, deoarece în controler am setat $scope.hello la "Hello Plunker!", dacă linia se citește:

angular.module('myApp', ['angularUtils.directives.dirPagination']);

Atunci pagina afișează „Hello Plunker!”.

Ce fac greșit?

Vă mulțumesc pentru ajutor!

4 răspunsuri
KRISHNA PATEL
  1. Trebuie să includeți angular.js înainte de orice alt script care va utiliza angular. Aici adăugați script.js înainte de angular.js

  2. De asemenea, trebuie să folosiți aceleași versiuni ale modulelor angular angular-animate, angular-aria, angular-messages ca și cea a modulelor angular.js versionAici ați folosit versiunea 1.6.4 de angular.js

        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-animate.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-aria.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular-messages.min.js"></script>
    

Poți verifica modificările pe care le-am făcut în plnkr-ul tău https://plnkr.co/edit/En0YaiaiqD1MPPOydAf8?p=preview

De asemenea, au existat erori pentru solicitarea cross domain request pentru bootstrap.min.css, care pot fi ușor corectate folosind

https://

cdn

Sajeetharan

Îți lipsește scriptul pentru material.css, iar ordinea este greșită.

  <script data-require="[email protected]" data-semver="1.3.0" src="https://code.angularjs.org/1.3.0/angular.js"></script>
  <link rel="stylesheet" href="//rawgit.com/angular/bower-material/master/angular-material.css" />
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>
  <script src="script.js"></script>
  <script src="dirPagination.js"></script>

DEMO DE LUCRU

Rohan Kawade

Acesta este un demo de lucru, a fost o problemă de versiune și, de asemenea, ordinea de declarare. JS fișier.

Thomas David Kehoe

Voi adăuga doar că angular-material.js necesită angular-animate.js și angular-aria.jsși ultimele două ar trebui să fie înainte de angular-material.js. angular-messages.js nu pare a fi necesară.