$ 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

答えて

関連する問題