HEAD与BODY中的AngularJS

Question

在所有AngularJS示例中，Angular库都放在文档的HEAD标记中。我有一个基于HTML5 Boilerplate布局的现有项目。这定义了JS库应该放在</BODY>标记之前的DOM的最底部。

AngularJS是否需要放在HEAD中？

Answer 1

AngularJS不需要放在HEAD中，实际上你通常不应该这样做，因为这会阻止加载HTML。

但是，当您在页面底部加载AngularJS时，您需要使用ng-cloak或ng-bind来避免“未编译内容的闪存”。请注意，您只需在“index.html”页面上使用ng-cloak / ng-bind。当在初始页面加载后使用ng-include或ng-view或其他Angular构造来引入其他内容时，该内容将在Angular显示之前进行编译。

另见https://stackoverflow.com/a/14076004/215945

Answer 2

Google网上论坛的这一个答案给了我完美的见解（缩短）：

  

这实际上取决于着陆页的内容。如果大多数   是静态的，只有少数AngularJS绑定比是，我同意，   页面底部是最好的。但是在完全动态的情况下   您想要加载AngularJS ASAP的内容[在头部]。

因此，如果您的内容大部分是通过Angular生成的，那么只需将Angular包含在头部就可以节省额外的CSS和ng-cloak指令。

https://groups.google.com/d/msg/angular/XTJFkQHjW5Y/pbSotoaqlkwJ

Answer 3

不一定。

请查看此http://plnkr.co/edit/zzt41VUgR332IV01KPsO?p=preview。 角度js放置在页面底部的位置，如果放置在顶部，仍然会呈现相同的输出。

Answer 4

在页面底部加载Angular JS确实会导致丑陋的{{something}} html。在body标签中使用ng-cloak指令会创建一个空的flash，直到JS被加载，因此它不会在head元素中加载AngularJS时增加任何好处。您可以在其中添加ng-cloak到其中包含ng指令的每个元素，但最终会出现一些空元素。 Soooo，只需在头元素中加载Angular和你的app.js文件，就像Angular文档在他们的文档中引用的那样：“为了获得最佳结果，必须在html文档的head部分加载angular.js脚本”