angular如何知道ng-include文件的位置？

Question

我正在看这个sample Angular App。

在名为html的主[index.html][2]文件中，有以下一行：

<div ng-include="'header.tpl.html'"></div>

但是，同一目录中没有文件header.tpl.html。

然后Angular如何知道在哪里找到这个文件？

Answer 1

链接的示例应用程序是使用Grunt构建的，因此构建的应用程序的文件/文件夹结构与您在存储库中看到的不同。

例如，您要询问的模板由html2js（Grunt任务）收集并编译成单个JavaScript文件，其中包含将所有模板添加到$templateCache的代码（导致它们全部成为包含在应用程序初始化而不是在需要时延迟加载）。当ng-include开始查找文件时，其第一步是查看$templateCache。只有当它在那里找不到模板时，它才会尝试从服务器加载它（并将其保存到$templateCache以供后续使用）。

请参阅存储库中的Gruntfile.js以获取构建过程详细信息。