Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:nomod] Module ‘myApp’ is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify …
我将视频演示中的编辑(数组中只有3个演员)版本的EXACTLY复制到jsfiddle中,并发现它仍然产生相同的错误。 (为参考,Egghead演示如下:http://www.thinkster.io/angularjs/ET1iee6rnm/angularjs-ngfilter)。到目前为止,我已经阅读了至少六个类似的问题,并尝试了所有提供的解决方案,但没有一个可以摆脱这个错误,或者导致复仇者搜索 – 视频演示中的工作正常 – 实际运行正常。
HTML:
<div ng-app="myApp"> <div ng-controller="AvengersCtrl"> <input type="text" ng-model="search.$" /> <table> <tr ng-repeat="actor in avengers.cast | filter:search"> <td>{{actor.name}}</td> <td>{{actor.character}}</td> </tr> </table> </div> </div>
使用Javascript:
var myApp = angular.module('myApp',[]); myApp.factory('Avengers',function () { var Avengers = {}; Avengers.cast = [ { name: "Robert Downey Jr.",character: "Tony Stark / Iron Man" },{ name: "Chris Evans",character: "Steve Rogers / Captain America" },{ name: "Mark Buffalo",character: "Bruce Banner / The Hulk" } ]; return Avengers; }) function AvengersCtrl($scope,Avengers) { $scope.avengers = Avengers; }
简单地说,有人可以提供一个可以解决这个错误的解决方案,并且以简单的英语解释(不是Ph.D.级别的“Angular Obscurese”)导致它的原因(简而言之),需要什么做了避免吗?
工作小提琴:http://jsfiddle.net/Q5hd6/
说明:
当DOM完全加载时,Angular开始编译DOM。你注册你的代码来运行onLoad(在fiddle中的onload选项)=>注册您的myApp模块为时已晚,因为角度开始编译DOM,并且角度看到没有名为myApp的模块,并引发异常。
通过使用No Wrap – In Head,您的代码如下所示:
<head> <script type='text/javascript' src='//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.js'></script> <script type='text/javascript'> //Your script. </script> </head>
您的脚本有机会在角度开始编译DOM之前运行,并且在角度开始编译DOM时已经创建了myApp模块。