javascript - 无法加载 ui.bootstrap 模块

Question

我在 Angular 中加载 ui.bootstrap 模块时遇到问题 - 我收到以下错误消息，并且 Angular 无法启动:

Uncaught Error: [$injector:modulerr] Failed to instantiate module mailingexchangeApp due to:
Error: [$injector:modulerr] Failed to instantiate module ui.bootstrap due to:
Error: [$injector:nomod] Module 'ui.bootstrap' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

这是我加载模块的方式:

var exampleApp = angular.module('exampleApp', ['ui.bootstrap']).config(function($interpolateProvider) {
    $interpolateProvider.startSymbol('[[').endSymbol(']]');
});

这就是我包含的库，全部位于头部:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script>
<script src="/js/controllers.js"></script>
<script src="/js/ui-bootstrap-tpls-0.13.2.min"></script>
<script src="/js/modernizr-2.6.2.min.js"></script>
<script src="/js/jquery-1.10.2.min.js"></script>
<script src="/js/tablesorter/jquery.tablesorter.js"></script>
<script src="/js/tablesorter/tables.js"></script>
<script src="/js/jquery-ui.min.js"></script>

怎么了？我该如何解决这个问题？

Answer 1

在尝试访问之后，您将在 html 中加载实际的 js 文件:

<script src="/js/controllers.js"></script>
<script src="/js/ui-bootstrap-tpls-0.13.2.min"></script>

您想要在controller.js中引用的任何代码都需要在controllers.js之前加载。因此，最简单的解决方法是交换它们在 HTML 中的位置。但很可能还需要先加载其他文件。