web-dev-qa-db-ja.com

AngularJS 1.2 $インジェクタ:モジュラー

1.07の代わりにAngular 1.2を使用すると、次のコードは無効になります。

'use strict';

var app = angular.module('myapp', []);

app.config(['$routeProvider', '$locationProvider',
    function($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);
        $routeProvider.
        when('/', {
            templateUrl: 'part.html',
            controller: 'MyCtrl'
        }).
        otherwise({
            redirectTo: '/'
        });
    }
]);

問題はインジェクタ設定部分(app.config)にあります。

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.0rc1/$injector/modulerr?p0=muninn&p1=Error%…eapis.com%2Fajax%2Flibs%2Fangularjs%2F1.2.0rc1%2Fangular.min.js%3A31%3A252) 

私が正しく覚えているならば、この問題は角度1.1.6で始まった。

441
Dawid

この問題は、ngRouteモジュールが含まれていないために発生しました。バージョン1.1.6以降、これは別の部分です。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>

var app = angular.module('myapp', ['ngRoute']);
633
Dawid

最後にこの()を追加することでエラーが消えました

(function(){
    var home = angular.module('home',[]);

    home.controller('QuestionsController',function(){
        console.log("controller initialized");
        this.addPoll = function(){
            console.log("inside function");
        };
    });
})();
41
arp

これとしてリストに追加するもう1つのことは、「エラー:[$ injector:modulerr]角度」のグーグル検索を考え出した最初の結果です。

あなたの 'index'html'とあなたのメインのjavascriptアプリ定義の中であなたのアプリ名の間に不一致があるなら、これもこのエラーを生成することができます。

たとえば、HTMLがこのようになっているとします。

    </head>
    <body ng-app="myWebSite">

        <!-- My Web Site -->
        <p>About my web site...</p>

        etc ...

そして、あなたのJavaScriptはこのように見えます(すなわち、アプリ名にタイプミスがあります - myWebSiteの代わりにmyWebCite):

/** Main AngularJS Web Application */ 
var app = angular.module('myWebCite', [ 'ngRoute' ]); 

/** Configure the Routes */ 
app.config(['$routeProvider', function ($routeProvider) { 
  etc ...

それから 'Error:[$ injector:modulerr]角度'エラーも発生します。

40
Mick

Noobエラーはモジュールjsを含めることを忘れることがあります

<script src="app/modules/myModule.js"></script>

index.html内のファイル

24
otherDewi

ファイルを圧縮、バンドル、および縮小するフレームワークを使用している場合は、これらのフレームワークでは変数の名前が変更される傾向があるため、各依存関係を明示的に定義してください。 ASP.NETのBundleConfig.csを使用してアプリのスクリプトをまとめている間に、それが起こりました。

app.config(function($routeProvider) {
    $routeProvider.
      when('/', {
          templateUrl: 'list.html',
          controller: 'ListController'
      }).
      when('/items/:itemId', {
          templateUrl: 'details.html',
          controller: 'DetailsController'
      }).
      otherwise({
          redirectTo: '/'
      });
});

app.config(["$routeProvider", function($routeProvider) {
    $routeProvider.
      when('/', {
          templateUrl: 'list.html',
          controller: 'ListController'
      }).
      when('/items/:itemId', {
          templateUrl: 'details.html',
          controller: 'DetailsController'
      }).
      otherwise({
          redirectTo: '/'
      });
}]);

さらに読む about Angular依存関係の注釈。

13
Moses Machua

コンソール([$injector:nomod], MINERR_ASSET:22)でこのエラーが発生した場合は、AngularJSをロードする前にアプリケーションコードを含めないようにしてください。

私はそれをしていました、そして、一度私が注文を修正したならば、エラーは消えました。

12
Jasdeep Singh

私はちょうど同じエラーを経験したところです。私の場合、angular.moduleの2番目のパラメーターが欠落していることが原因でした。これは、同じ問題を抱えている人に役立つ可能性があります。

angular.module('MyApp');

angular.module('MyApp', []);

8
Anth12
add to link
<script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.0/angular-route.min.js"></script>

var app = angular.module('apps', [ 'ngRoute' ]); 
7
SirajuddinLuck

私は同じ問題を抱えていて、すべての可能な解決策を試しました。しかし、ついにドキュメントからngRouteモジュールが分離されたことがわかりました。これを見てみましょう link

解決策: cdnを追加してください angular-route.js の後 angular.min.js スクリプト

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>
6
Bastin Robin

このエラーのもう1つのトリガーは、「。」のままです。あなたの "そうでない"またはあなたのルート定義内の他のどのルートよりも前でアウト:

  app.config(['$routeProvider',
     function($routeProvider) {
        $routeProvider.
           when('/view1', {
              templateUrl: 'partials/view1.html',
              controller: 'Ctrl1'
           }).
           otherwise({
              redirectTo: '/viewCounts'
           });
     }]);

またしても、フルストップでほめられた。 JSが大好きです。

5
Hilary

以下の答えのほかにも、コンソール([$injector:nomod]MINERR_ASSET:22)にこのエラーがあってもすべてうまくいくように思われる場合は、必ずindex.htmlにduplicateが含まれていないこと)を確認してください。

このエラーはファイルのインクルードが重複している場合にも発生する可能性があるため、このモジュールが使用され、実際のモジュール宣言でファイルの前にインクルードされます。

4
pleerock

あなたがangularjs https://docs.angularjs.org/tutorial/step_07 の公式チュートリアルを経験するならば_ _

注意:AngularJSバージョン1.2以降、ngRouteはそれ自身のモジュール内にあり、追加のangular-route.jsファイルをロードすることによってロードする必要があります。

NgRoute api https://docs.angularjs.org/api/ngRoute にも注意してください。

インストール まず、HTMLにangular-route.jsを含めます。

このファイルは次の場所からダウンロードできます。

Google CDN //ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-route.jsバウアーインストール[email protected] code.angularjs.org。 "//code.angularjs.org/X.Y.Z/angular-route.js"ここで、X.Y.Zは実行しているAngularJSのバージョンです。

次に、依存モジュールとして追加して、アプリケーションにモジュールをロードします。

angular.module( 'app'、['ngRoute']);これで準備は整いました!

3
zahid9i

John Papaが、 this というややあいまいなコメントについて私の問題を提供しました。 それ以外の場合は、モジュールは使用後に定義されたことになります。これを簡単に解決する1つの方法は、モジュールファイルに* .module.jsという名前を付けて、それらを最初に読み込むことです。

2
Josh

プロジェクトを切り替えて、同じポートでプロジェクトを次々に実行しているときに、このエラーが発生することがあります。その場合はchrome Developer Tools> Networkに行き、実際に書かれたjsファイルでif the file match with the workspceをチェックしてください。これを解決するには、networkの下のDisable Cacheを選択します。

0
Shashi Ranjan

私の問題はconfig.xmlにありました。変化:

<access Origin="*" launch-external="yes"/>

<access Origin="*"/>

それを修正しました。

0
Frank Conry

何ヶ月も経って、AngularJS(1.6.4)アプリの開発に戻りました。開発中のテストには、Chrome(PC)とSafari(MAC)を選択しました。このコードはこれを表しました エラー:$ injector:modulerrモジュールエラー on IE 11.0.9600(Windows 7、32ビット)。

調査の結果、エラーがforEachループの使用によるものであることが明らかになりました。そのまま動作させるために、すべてのforEachループを通常のforループに置き換えてください。

これは基本的にAngularJSの問題ではなくIE11の問題(Answer here )ですが、発生した例外はAngularJSの例外であるため、ここに回答します。それが私たちの何人かがそこに役立つのを願っています。

同様に。ラムダ関数を使用しないでください...単に()=> {...}を良い 'function(){...}に置き換えてください。

0
Akber Iqbal

そのインジェクタエラーインジェクタが見つからない可能性があるので、たくさんのJavaScriptファイルを使用しているかもしれません。

いくつかはここにあります:

var app = angular.module('app', 
    ['ngSanitize', 'ui.router', 'pascalprecht.translate', 'ngResource', 
     'ngMaterial', 'angularMoment','md.data.table', 'angularFileUpload', 
     'ngMessages', 'ui.utils.masks', 'angular-sortable-view',          
     'mdPickers','ngDraggable','as.sortable', 'ngAnimate', 'ngTouch']
);

あなたがあなたのapp.jsに挿入する必要がある注射器をチェックしてください

0
Bipin Shilpakar