未明错误：[$injector:modulerr]未能用LABJS实例化模块

Question

在加载我的角度应用程序时，我一直收到这个错误。在Chrome，几个刷新和我的应用程序将运行，但IE和FF是一个不去。

这个错误将我链接到这个错误页，但我不太明白它说了什么。

我正在使用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

您应该使用手动引导应用程序，因为您使用了异步脚本加载程序：

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

文档中的：

自动初始化 角自动初始化DOMContentLoaded事件或当angular.js脚本被计算时，如果当时document.readyState被设置为‘完成’。此时，角查找ng-app指令，它指定应用程序根目录. 手动初始化 如果您需要对初始化过程有更多的控制，则可以使用手动引导方法。当您需要这样做的时候，的例子包括使用脚本加载器、或需要在角度编译页面之前执行操作。

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