Angular JS 未捕获错误：[$injector:modulerr]

Question

我在 Angular JS 收到错误时遇到问题：未捕获的错误：[$injector:modulerr]。 我的 JS 文件看起来

angular.module('MyApp', ['ngRoute']);
angular.module('MyApp',['ngResource']);
function TwitterCtrl($scope,$resource){
}

我还包括了 angular-route-js

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

Angular 文档说问题是http://docs.angularjs.org/api/ngRoute

Answer 1

尝试添加这个：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>

Answer 2

尝试添加：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js">

和：

angular.module('MyApp', ['ngRoute','ngResource']);
function TwitterCtrl($scope,$resource){
}

您应该只调用一次 angular.module 并使用所有依赖项，因为使用您当前的代码，您正在创建一个新的 MyApp 模块覆盖前一个模块。

来自angular documentation：

请注意，使用 angular.module('myModule', []) 将创建 模块 myModule 并覆盖任何名为 myModule 的现有模块。采用 angular.module('myModule') 检索现有模块。

Answer 3

好的，如果你得到一个Uncaught Error: [$injector:modulerr] 并且角度模块在告诉你的错误中，你有一个重复的 ng-app 模块。

Answer 4

该错误意味着依赖注入器无法找到依赖“ngResource”。接受的答案中的脚本标签提供了这种依赖关系。

如果您在依赖项中添加任何自定义模块但未添加包含包含依赖项的“.js”文件的脚本标记，也会出现相同的错误。

Answer 5

确保你的函数被包裹在一个闭包中，并在末尾加上额外的 ()：

(function(){                                                                     

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


})();  

Answer 6

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

参考来自：AngularJS 1.2 $injector:modulerrDavid answer

Answer 7

在开发环境中，我建议您使用非缩小分布。并且所有错误都变得更加有用！代替angular.min.js，使用angular.js。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.js">     
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.js">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.js">

Answer 8

我之前遇到过同样的问题，但我意识到我没有在我的主页 (index.html) 中包含“app.js”（主应用程序）。 因此，即使您包含 AngularJS 所需的所有依赖项，您也可能最终在控制台中出现该错误。因此，请务必确保在您的主页中包含必要的文件，这样您就不应该遇到这个问题。

希望这会有所帮助。

Answer 9

只是把它扔掉以防万一，我遇到了这个问题，原因是当我捆绑我的 Angular 东西时，我将主应用程序文件引用为“AngularWebApp”而不是“AngularWebApp.js”，希望这会有所帮助.

Answer 10

我收到此错误是因为我依赖于另一个未加载的模块。

angular.module("app", ["kendo.directives"]).controller("MyCtrl", function(){}...

所以即使我有所有的 Angular 模块，我也没有剑道模块。

Answer 11

我遇到了完全相同的问题，解决方法是移除关闭：

$(function(){
    var app = angular.module("myApp", []); 
    app.controller('myController', function(){
        ...
    });
});

变成：

var app = angular.module("myApp", []); 
app.controller('myController', function(){
    ...
});

Answer 12

确保保存 angular.module 的变量结构正确。

这将失败并显示“未捕获的错误：[$injector:modulerr]”：

var angApp = angular.module("angApp");

这行得通：

var angApp = angular.module("angApp", []);

这是一个鬼鬼祟祟的问题，因为错误消息并没有特别指向一件事（因此答案多种多样）。此外，大多数 js linter 不会捕捉到细节。坚持下去！

Answer 13

我遇到了同样的问题。您应该在这样的任何函数之外键入您的 Angular js 代码：

$( document ).ready(function() {});

Answer 14

我也遇到了同样的问题，我刚刚从 BundleConfig.cs 文件中删除了以下代码行，我的代码工作正常。

BundleTable.EnableOptimizations = true;

Answer 15

不要在 cdn 链接脚本标签内加载 javascript。使用单独的脚本标签来加载 AngularJs 脚本。 我有同样的问题，但我创建了一个单独的<script> 然后错误消失了。