$ injector：modulerr模塊在angularjs中的錯誤1

將ngMaterial添加到模塊會導致錯誤。我看不出有什麼問題。

** **成功

var routerObj = angular.module('note', ['ngRoute','ngAnimate']);

**誤差（link）**

var routerObj = angular.module('note', ['ngRoute','ngAnimate','ngMaterial']);

爲什麼在上述代碼中的差異導致的錯誤？

<!DOCTYPE html> 
    <html ng-app="note" ng-controller="homeCtrl" ng-class="animation"> 
     <head> 
     <meta charset="utf-8">  
     <base href="/"> 
     <title></title> 



     <!-- Angularjs --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
     <!-- AngularRoute --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.min.js"></script> 
     <!-- AngularAnimation --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.min.js"></script> 
     <!-- Angular Material Library --> 
     <script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script> 

     <!-- Latest compiled and minified CSS --> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
     <!-- Jquery --> 
     <script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha256-/SIrNqv8h6QGKDuNoLGA4iret+kyesCkHGzVUUV0shc=" crossorigin="anonymous"></script> 
     <!-- Latest compiled and minified JavaScript --> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
     <!-- font awesome --> 
     <link rel="stylesheet" href="/design/font-awesome.min.css"> 

     <!-- layout --> 
     <link rel="stylesheet" href="/design/layout.css"> 

     <!-- route animation --> 
     <link rel="stylesheet" href="/design/route-animation.css"> 
     <!-- Angular Material style sheet --> 
     <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css"> 



      <script> 
      (function(){ 

       //module init 
       var routerObj = angular.module('note', ['ngRoute','ngAnimate','ngMaterial']); 

       //route 
       routerObj.config(function ($routeProvider, $locationProvider) { 
        $routeProvider 
         .when('/home', {templateUrl: '/template/home.html', animation: 'fade-in'}) 
         .when('/popular', {templateUrl: '/template/list-popular.html', animation: 'slide-left'}) 
         .otherwise({redirectTo: '/home', animation: 'fade-in'}); 

        //url hash code eliminate 
        $locationProvider.html5Mode(true); 

       }); 

       //controll layout(GNB Ctrl, Animation Ctrl) 
       routerObj.controller('homeCtrl', function($scope, $rootScope, $location){ 
        // route animation 
        $rootScope.$on('$routeChangeStart', function(event, currRoute, prevRoute){ 
        $rootScope.animation = currRoute.animation; 
        }); 
        // current url(GNB show/hide controll) 
        switch($location.path()){ 
         case "/home": 
          $rootScope.basicLayout = true; 
         break; 
         default: 
          $rootScope.basicLayout = false; 
         break; 
        } 

       }); //end homeCtrl 

      }());  
      </script> 
     </head> 
     <body> 

     <p>ngRoute, ngMaterial</p> 

     </body> 
    </html>

來源

2016-12-29 user7354286

角材料具有一些依賴

嘗試添加：

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-aria.min.js"></script>

和：

var routerObj = angular.module('note', ['ngRoute','ngAnimate','ngMaterial', 'ngAria']);

來源

2016-12-29 14:57:12

問題已解決。感謝您的建議。：D – user7354286

ngMaterial模塊未能加載。檢查它是否正確安裝和配置。檢查控制檯中的錯誤。

來源

2016-12-29 14:55:55

包括必要的腳本角aria.min &角消息.min，它應該按照以下順序。

<!-- Angularjs --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
     <!-- AngularRoute --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-route.min.js"></script> 
     <!-- AngularAnimation --> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animate.min.js"></script> 

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-aria.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-messages.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>

來源

2016-12-29 14:58:33

已添加消息模塊。謝謝您的回覆。 – user7354286

$ injector：modulerr模塊在angularjs中的錯誤1

回答

相關問題