将ng-includes下载所有包含的HTML或预编译为单个HTML

Question

从性能POV开始，使用ng-include Angular指令会将包含的HTML作为自己的文件下载到用户的浏览器中吗？

我没有使用节点服务器来提供HTML文件，我正在使用像AWS CloudFront这样的CDN。

Answer 1

AngularJS是一个完全客户端的框架，所以，是的，它将下载每个模板，它不会预编译任何东西。

您可能希望在客户端构建过程中包含类似gulp-ng-templates的内容。这将生成一个单独的js文件，该文件将使用其自然URL将所有模板预加载到模板缓存中（因此您的其他代码无需更改）

Answer 2

ng-include将根据要求下载模板。因此，如果您使用ng-include包含3个模板，则表示3个ajax请求。

但是，您可以使用类型等于index.html将模板作为脚本包含在text/ng-template中

<script type="text/ng-template" id="my-tpl.html">
  Content of the template.
</script>

然后：

<div ng-include="my-tpl.php"></div>

这样，您将在一个文件中包含所有模板。