Question

当我使用jsfiddle学习Angular时，我得到了一个像blow一样的错误：

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

错误：[$ injector：nomod]模块'MyApp'不可用！您要么错误拼写了模块名称，要么忘记加载它。如果注册模块，请确保将依赖项指定为第二个参数。

谢谢@Khanh TO's answer，我解决了这个问题。

但我不明白为什么我不能把代码放在dom ready事件中。

所以出现同样的错误：

<!DOCTYPE html>
<html lang="en" ng-app="MyApp">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.js"></script>
    <script>
        document.addEventListener('DOMContentLoaded',function() {
            var app = angular.module('MyApp',[]);
        }, false);
    </script>
</head>
<body>
    <div>
        Hello {{val}}
    </div>
</body>
</html>

所以我有两个问题

1：我应该如何理解 Angular在DOM完全加载时开始编译DOM。

2：由于Angular在DOM完全加载时开始编译DOM，上面的代码应该正确运行，但是为什么会发生错误。

提前感谢您的帮助。

Answer 1

您的代码在执行时创建角度模块。它只是添加了一个将在未来创建它的事件监听器。

假设Angular还监听DOMContentLoaded开始编译，现在我们有两个事件处理程序监听同一事件。
假设某个特定浏览器按照它们附加的顺序执行处理程序。由于角度是在脚本之前加载的，因此它会在您的脚本之前附加处理程序。因此，angular的事件处理程序将首先触发，它将开始编译，但此时此模块不存在。只有在事后处理事件处理程序时才会创建模块。因此它会引发错误。

你应该在执行时编写创建角度模块的脚本，这样当执行脚本并且DOM准备就绪时，它将可用。

Answer 2

在DOMContentLoaded上添加一个事件监听器来创建一个角度模块，但是当有一个＆＃39; ng-app＆＃39 ;;

时，angular会添加一个事件监听器以自动绑定

关键是在你的事件＆＃39; DOMContentLoaded＆＃39;之前回调角度执行。解雇了，因此无法找到名为“MyApp＆＃39;

”的模块

你应该怎么做才能将代码直接放在标签中，如下所示：

<script>
    var app = angular.module('MyApp',[]);
</script>

但是，最好是手动初始化

https://docs.angularjs.org/guide/bootstrap

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

2 个答案: