AngularJS为什么不能使用多个延迟脚本？ [英] Why won't AngularJS work with multiple defer scripts?

问题描述

我在HTML的底部有以下内容：

I have the following at the bottom of my HTML:

<script defer="defer" src="http://localhost:8080/bower_components/jquery/dist/jquery.min.js"></script>
<script defer="defer" src="http://localhost:8080/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script defer="defer" src="http://localhost:8080/apps/promotion/active.js">
    // "Gulped" angular, ngAnimate, ui.bootstrap, and my angular app; in that order.
</script>
</body>
</html>

在随机时间，刷新页面时会出现此错误：

At random times, I will get this error when I refresh the page:

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.9/$injector/modulerr?p0=activePromos&p1=Err…20(http%3A%2F%2Flocalhost%3A8080%2Fapps%2Fpromotion%2Factive.js%3A1%3A7124)

有时它会连续多次刷新，有时会连续多次刷新。不过，有时候我会收到错误消息，并且变得很烦人。

Sometimes it will happen for multiple refreshes in a row, and sometimes it will work for multiple refreshes in a row. Nevertheless, there are times when I get the error and it's getting annoying.

我发现的内容如下：如果我删除了 jquery 和 bootstrap 脚本，所以我只有一个脚本（active.js）， defer 属性，它始终有效。在页面以指定顺序完成加载后，我试图加载脚本。

What I found out is the following: If I remove the jquery and bootstrap scripts so that I only have the one script (active.js) with the defer attribute, it always work. I am trying to load the scripts after the page is done loading in the specified order.

我应该以其他方式（requirejs？）这样做吗？我假设使用 defer 并按顺序排列脚本会有所帮助，因为我之前已经做过，但不是使用AngularJS。 我主要是想利用浏览器的并行下载优势，而不是拥有一个巨大的JS文件，因为该页面只有1个图像和2个CSS文件。

Should I be doing this a different way (requirejs?)? I assumed using defer and putting the scripts in order would help since I've done it before, but not with AngularJS. I am mainly trying to take advantage of parallel downloads from the browser instead of having one huge JS file, since the page only has 1 image and 2 CSS files.

推荐答案

只有在加载了所有必需的JavaScript文件之后，Angular应用程序才能正确初始化。

The angular app will not be able to initialize properly until after all of the required JavaScript files are loaded.

由于您推迟了这些文件的加载，因此需要等待所有文件加载完毕，然后使用 AngularJS的引导程序功能。

Since you are deferring the load of those files, you will need to wait until all of the files are loaded, and then manually initialize the app using AngularJS's bootstrap function.

这篇关于AngularJS为什么不能使用多个延迟脚本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！