Question

我在加载Angular应用时遇到此错误。在Chrome中，一对夫妇刷新，我的应用程序将运行，但IE和FF是不行。

错误将我链接到此error page，但我真的不明白它的含义。

我正在使用LabsJS加载我的应用，包括控制器和服务。

// spAppLoader.js

$LAB
    .script("../js/app.js").wait()
    .script("../js/controllers/userCtrl.js")
    .script("../js/controllers/groupCtrl.js")
    .script("../js/controllers/siteCtrl.js")
    .script("../js/services/userServices.js")
    .script("../js/services/groupServices.js")
    .script("../js/services/siteServices.js")

标记：

<div id="mdContainer" ng-app="spApp" ng-cloak>
  ...
</div>
<script type="text/javascript" src="../js/spAppLoader.js"></script>

我想发布更多代码，但我不知道从哪里开始，而且角度一切都在多个文件中。我是通过github上传的。

Answer 1

您应该manually bootstrap您的应用，因为您使用异步脚本加载器：

$LAB
    .script("../js/app.js").wait()
    .script("../js/controllers/userCtrl.js")
    .script("../js/controllers/groupCtrl.js")
    .script("../js/controllers/siteCtrl.js")
    .script("../js/services/userServices.js")
    .script("../js/services/groupServices.js")
    .script("../js/services/siteServices.js")
    .wait(function(){
      var root = document.getElementById('mdContainer')
      angular.bootstrap(root ,['spApp']);
    })

什么是自举？

angular.bootstrap(root ,['spApp']);与<div id="mdContainer" ng-app="spApp">相同，只有最后一个会在DOMContentLoaded event发生时自动初始化您的应用。

使用脚本加载器时，DOMContentLoaded event可能会在加载所有脚本之前发生，因此您必须等待所有模块脚本，然后手动引导应用程序。

在您的情况下，chrome可能会缓存您的脚本，因此在几次刷新后，DOMContentLoaded event在所有脚本加载后发生。

来自文档：

自动初始化

Angular会在DOMContentLoaded事件时自动初始化，或者在评估angular.js脚本时，如果此时document.readyState设置为“complete”。此时，Angular会查找指定应用程序根目录的ng-app指令...

手动初始化

如果您需要对初始化过程有更多控制权，可以使用手动引导方法。您需要执行此操作的示例包括使用脚本加载器或在Angular编译页面之前执行操作的需要。

Answer 2

此错误通常意味着角度无法找到您尝试注入控制器或其他一些注射功能的对象。在快速查看代码之后，我的猜测是文件的加载方式存在问题，因为您从多个文件引用spApp。

我通常做的是将单独的文件移动到他们自己的模块中，然后根据需要需要其他模块。例如，不要像这样启动userService：

spApp.factory('userService', function(){

将其放入自己的模块

angular.module('spApp.services.user', [])
    .factory('userService', function(){

然后，当您需要在另一个模块中使用userService时，请将其添加为要求。例如：

var spApp = angular.module('spApp', ['spApp.services.user']);

未捕获错误：[$ injector：modulerr]无法使用LABJS实例化模块

2 个答案:

什么是自举？

自动初始化

手动初始化