在 angularJS 应用程序中重新加载页面导致缺少依赖项错误

Question

我有一个使用 ui.bootstrap 指令的 angularJS 应用程序。 ui.bootstrap 模块包含在索引中，如下所示：

<!-- JQuery first -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <!-- Then bootstrap it -->
    <script src="/lib/js/tinymce/tinymce.min.js"> </script>
    <script src="/bootstrap/js/bootstrap.min.js"></script>

    <!-- Then let AngularJS take the wheel -->
    <script src="/angular/angular.js"></script>
    <!-- add dependencies -->
    <script type="application/javascript" src="lib/angular-bootstrap/ui-bootstrap.js"></script>
    <script type="application/javascript" src="lib/angular-bootstrap/ui-bootstrap-tpls.js"></script>
    <script type="text/javascript" src="/lib/angular-ui-tinymce/src/tinymce.js"></script>
    <script src="/lib/angular-route.min.js"></script>

    <!-- App client -->
    <script src="/app.js"></script>

    <!--Controllers-->

这在我正常点击网站时有效，但是当点击浏览器的重新加载按钮时，我收到以下错误：

Uncaught Error: [$injector:modulerr] Failed to instantiate module reviewModule 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.
http://errors.angularjs.org/1.3.15/$injector/nomod?p0=ui.bootstrap

这只是 angular 的怪癖吗？我以前在重新加载时遇到过这样的问题。有没有办法阻止reload事件的默认动作，手动用routeProvider处理？

Answer 1

这可能是某种竞争条件的结果。您的 app.js 脚本加载速度比其他脚本快，因此它会给您注入器错误。尝试在 head 和 body

中加载 app.js 的依赖项

Answer 2

请注意 src="lib/angular-bootstrap/ui-bootstrap.js" 不是以斜线开头。这会导致从当前目录而不是根目录引用脚本。像这样更改所有脚本标签以包含初始斜杠：src="/lib/angular-bootstrap/ui-bootstrap.js" 通过从应用程序根目录引用脚本路径来解决问题。

在 angularJS 应用程序中重新加载页面导致缺少依赖项错误

In angularJS application reloading the page causes missing dependency errors

javascript

jquery

url-routing

twitter-bootstrap

angularjs