AngularJS 1.2 $injector:modulerr

当使用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)

如果我没记错的话，这个问题是从angular 1.1.6开始的。

464606 次浏览
小开
最佳答案

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

除了下面的答案，如果你在控制台([$injector:nomod]， MINERR_ASSET:22)中出现这个错误，但一切似乎都正常工作，请确保你的index.html中包含了没有副本。

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

小开

如果在控制台([$injector:nomod], MINERR_ASSET:22)中出现此错误，请确保在加载AngularJS之前没有包含应用程序代码

我这样做了，一旦我修正了顺序，错误就消失了。

小开

还有一件事要添加到列表中，因为这是谷歌搜索'Error: [$injector:modulerr] angular'得到的第一个结果:

如果你在你的'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 ...

那么也会生成'Error:[$injector:modulerr] angular'错误。

小开

在最后加上这个“()”，我的错误就消失了

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


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

对于那些使用压缩、捆绑和缩小文件的框架的人，请确保显式地定义每个依赖项，因为这些框架倾向于重命名变量。我在使用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依赖注释的点击这里阅读更多。

小开

如果你通过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:

你可以

谷歌CDN / / ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-route.js鲍尔 例如:bower install angular-route@X.Y.Z code.angularjs.org "//code.angularjs.org/X.Y.Z/angular-route.js"，其中X.Y.Z是 你正在运行的AngularJS版本 然后将该模块作为依赖项添加到应用程序中 模块:< / p > < p >角。模块(“应用程序”,[' ngRoute ']);有了这些，你就可以开始了 开始!< / p >

小开

我的问题在config.xml中。改变:

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

来

<access origin="*"/>

固定它。

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

这个错误的另一个触发点是在你的路由定义中把"."放在" else "或任何其他路由之前:

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

再一次被句号羞辱。爱死JS了!

小开

noob错误可能是忘记包含模块js

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

index.html中的文件

小开

我也遇到了同样的问题，尝试了所有可能的解决方法。但最后我从文档中得知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>
小开

我刚刚经历了同样的错误，在我的情况下，这是由angular.module中的第二个参数缺失引起的-希望这可以帮助解决相同问题的人。

angular.module('MyApp');

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

小开

John Papa在这上提供了我的问题，相当模糊的评论:有时当你得到这个错误时，这意味着你缺少一个文件。其他时候，它意味着模块是在使用之后定义的。一种简单的解决方法是将模块文件命名为*.module.js并首先加载这些文件。

小开

这是注入器错误。你可能使用了很多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中的注入器

小开

有时，当您在项目之间切换并在同一个端口上一个接一个地运行项目时，我看到过这种错误。在这种情况下，去chrome开发工具>网络，并尝试检查实际编写的js文件:if the file match with the workspce。要解决此问题，请在network下选择Disable Cache。

小开

几个月后，我回来开发一个AngularJS (1.6.4,)应用程序，在开发过程中我选择了Chrome (PC)和Safari (MAC)进行测试。这段代码在IE 11.0.9600 (Windows 7, 32位)上显示了这个错误:$injector:modulerr模块错误。

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

这基本上是一个IE11问题(回答在这里)，而不是AngularJS问题，但我想把这个回答放在这里，因为引发的异常是一个AngularJS异常。希望这能对我们中的一些人有所帮助。

类似的。不要使用lambda函数…只需replace()=>{…}具有良好的ol' function(){…}

小开

我有这个问题，检查我的代码行后，我看到了这个

 <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>

并且它起作用了。


提交答案