AngularJS 1.2 $ injector：modulerr

445

当使用angular 1.2代替1.07时，以下代码不再有效，为什么？

'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开始的。

javascript angularjs

— 肖恩
source

636

该问题是由于缺少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']);

— 肖恩
source

492

如果您不确定缺少哪个模块，请使用未压缩的angular.js，它会给出可读的错误消息：

"Error: [$injector:nomod] Module 'ngRoute' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument."

— Mart

2

嗯，我使用的是Bower，它提供了.map文件-我不知道为什么Chrome仍然向我显示缩小文件中的错误。感谢大家的注意，@ Mart！

— Aditya MP

5

@ arg20，您将在这里找到答案：github.com/angular/angular.js/commit/…–

— Laurent

4

我一直在到处寻找解决方案。我从1.0升级到1.2，并收到此错误。我能找到的唯一建议是确保包括了angular-route.js，它确实是...。不喜欢Angular文档。反正谢谢你！我投票赞成。

— RachelD

4

如果在定义模块时使用angular.module（'myModule'）而不是angular.module（'myModule'，[]），则可能会出现此错误。stackoverflow.com/questions/16260538/...

— AnirudhanĴ

42

我的错误通过在末尾添加此'（）'而消失

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

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

— 阿普
source

40

还有一件要添加到列表中的事情，因为这是Google搜索“错误：[$ injector：modulerr]角”的第一个结果：

如果您在'index'html'中的应用名称与主要javascript应用定义中的应用名称不匹配，这也会产生此错误。

例如，如果您的HTML如下所示：

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

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

        etc ...

而且您的JavaScript如下所示（即，应用名称上有错别字-myWebCite而不是myWebSite）：

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

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

那么也会生成“错误：[$ injector：modulerr]角度错误”错误。

— 米克
source

我对此非常了解。我已经设置了ng-app =“ app” ...，然后再也没有设置模块。因此，它跳出了错误。作为初学者，我只是删除了=“ app”部分以使示例代码正常工作。后来，我设置了正确的模块和路由... :)

— Eric Burdo'Feb 11'15

25

一个菜鸟错误可能会忘记包括模块js

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

完全在index.html中的文件

— 其他戴维
source

24

令人惊讶的是调试/错误消息的角度。

— 莫里森

3

大声笑。我对自己说，不，我不能犯这个简单的错误。我多次通过了您的答案。但这解决了我的问题。

— Maubeh

关于丢失的一些进口商品

— famas23年

13

对于那些使用压缩，捆绑和缩小文件框架的人，请确保您明确定义每个依赖项，因为这些框架倾向于重命名变量。这是我在使用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: '/'
      });
}]);

在此处阅读有关Angular Dependency Annotation的更多信息。

— 摩西·马丘（Moses Machua）
source

12

如果您在控制台中遇到此错误([$injector:nomod], MINERR_ASSET:22)，请确保在加载之前不包括应用程序代码AngularJS

我这样做了，确定订单后，错误就消失了。

— 贾斯迪普·辛格（Jasdeep Singh）
source

9

我刚刚遇到了相同的错误，在我的情况下，这是由中的第二个参数引起的 angular.module缺少 -希望这可以对遇到相同问题的人有所帮助。

~~angular.module('MyApp');~~

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

— Anth12
source

1

这是我的问题；我缺少对angular.module（'my.Namespace'，[]）的声明；在使用angular.module（'my.Namespace'）。directive（'myDirective'之前，[...

— ScottFoster1000，2017年

7

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' ]);

— 西拉祖丁·勒克
source

忘记使用特定依赖项时必须包括src！

— 卡尔·莫里森

6

我遇到了同样的问题，并尝试了所有可能的解决方案。但是最后我从文档中得知ngRoute模块已分离。看看这个链接

解决方案：在angular.min.js脚本之后添加cdn angular-route.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>

— 巴斯汀·罗宾（Bastin Robin）
source

5

此错误的另一个触发因素是保留“。” 在您的“其他”或您的路线定义中的任何其他路线之前：

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

由句号修饰，再次出现。要爱JS！

— 希拉里
source

4

除了下面的答案，如果你有控制台这个错误（[$injector:nomod]，MINERR_ASSET:22），但一切似乎做工精细，确保你没有重复的包含您的index.html。

因为如果重复包含文件，则使用此模块，并且包含在具有实际模块声明的文件之前，也可能引发此错误。

— 佩勒罗克
source

3

如果您阅读angularjs的官方教程https://docs.angularjs.org/tutorial/step_07

注意：从AngularJS 1.2版开始，ngRoute在其自己的模块中，必须通过加载其他的angular-route.js文件进行加载，该文件是我们通过Bower在上面下载的。

另外请注意ngRoute api https://docs.angularjs.org/api/ngRoute

安装首先在HTML中包含angular-route.js：

您可以从以下位置下载此文件：

Google CDN，例如//ajax.googleapis.com/ajax/libs/angularjs/XYZ/angular-route.js Bower，例如bower install angular-route @ XYZ code.angularjs.org，例如“ //code.angularjs.org/XYZ/ angular-route.js”，其中XYZ是您正在运行的AngularJS版本。

然后通过将模块添加为依赖模块来将其加载到应用程序中：

angular.module（'app'，['ngRoute']）; 这样，您就可以开始了！

— zahid9i
source

2

约翰·帕帕（John Papa）就这个晦涩的评论提供了我的问题：有时，当您收到该错误时，则意味着您丢失了一个文件。其他时候，这意味着模块是在使用后定义的。轻松解决此问题的一种方法是命名模块文件* .module.js并首先加载它们。

— 乔希
source

0

我的问题是在config.xml中。变更：

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

至

<access origin="*"/>

固定它。

— 弗兰克·康瑞
source

0

它是喷油器错误。您可能使用了很多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

— 比平·希尔帕卡（Bipin Shilpakar）
source

0

有时，当您在项目之间切换并在一个端口上一个接一个地运行项目时，我已经看到了此错误。在这种情况下，转到chrome开发人员工具>网络，然后尝试检查实际的书面js文件是否存在：if the file match with the workspce。要解决此问题，请Disable Cache在“网络”下选择。

— 沙希·兰詹（Shashi Ranjan）
source

0

几个月后，我返回开发AngularJS（1.6.4）应用程序，为此我选择了Chrome（PC）和Safari（MAC）进行开发期间的测试。这段代码显示了以下错误：IE 11.0.9600（Windows 7，32位）上的$ injector：modulerr模块错误。

经调查，很明显该错误是由于使用了forEach循环而引起的，只是将所有的forEach循环替换为正常的for循环，以使事情按原样工作...

基本上，这是一个IE11问题（在此处回答），而不是AngularJS问题，但是我想将这个答复放在这里，因为引发的异常是AngularJS异常。希望它对我们中的某些人有帮助。

同样。不要使用lambda函数...只需将（）=> {...}替换为良好的ol'function（）{...}

— 阿克伯·伊克巴尔
source

0

我遇到了这个问题，在逐行检查代码后，我看到了

 <textarea class="form-control" type="text" ng-model="WallDesc" placeholder="Enter Your Description"/>

我只是将其更改为

     <textarea class="form-control" type="text" ng-model="WallDesc" placeholder="Enter Your Description"></textarea>

并且有效。因此，请检查您的标签。

— 阿雷夫·博格梅尔（Aref Bozorgmehr）
source