AngularJS：未捕获的错误：[$ injector：modulerr]无法实例化模块？

萧修永

2023-03-14

问题内容：

我是AngularJS的新手，并且通过一些文档和教程来学习。我的问题是参考Egghead的视频系列，尤其是该视频，该视频演示了如何组合基本的搜索过滤器。我想在一个真正的应用中使用此应用，我正在为一家从事蜡烛业务的小朋友打造，但是当我将其修改为她的蜡烛而不是复仇者联盟的演员（如视频中的演示）时，出现此错误：

未捕获的错误：[$ injector：modulerr]由于以下原因，无法实例化模块myApp：

错误：[$ injector：nomod]模块’myApp’不可用！您可能拼错了模块名称，或者忘记了加载它。如果注册模块，请确保指定…

我将视频演示中的精确版本（数组中只有3个演员）复制到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;
}

简而言之，有人可以提供一种可以解决该错误的解决方案，并且可以用简单的英语（不是博士级别的“ Angular
Obscurese”）进行解释（简而言之）是什么原因以及需要做什么的。做了避免吗？

编辑：抱歉，但是上面从教程中引用的jsfiddle链接不再有效。我已经删除了断开的链接。提到的教程仍然可供查看。

问题答案：

尝试在小提琴中使用 无包裹-头戴 或 无包裹-身体 ：

工作提琴：http :
//jsfiddle.net/Q5hd6/

说明：

DOM 完全加载后， Angular开始编译DOM
。您注册要运行的代码onLoad（小提琴中的onload选项）=>现在注册myApp模块已为时已晚，因为angular开始编译DOM，而angular看到没有命名的模块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>

您的脚本有机会在angular开始编译DOM之前运行，并且angular开始编译DOM myApp时已经创建了模块。

AngularJS：未捕获的错误：[$ injector：modulerr]无法实例化模块？

相关阅读

相关文章

相关问答

相关工具

相关文档