AngularJS：什么是 $templateCache？

Question

在分析大型 AngularJS 应用程序时，我开始跟踪 $templateCache。

https://docs.angularjs.org/api/ng/service/$templateCache

这个物体是什么？ 它是否存储存储在磁盘上的部分内容或路由中最终渲染的 HTML？

我在我的控制器中添加了一些这样的代码，以确保它不会保留任何内容：

$scope.$on('$destroy', function cleanup() {
   $templateCache.removeAll();
});

编辑：我研究这个问题的原因是单个（不是每个）控制器正在加载一个大的部分，其中有多个循环，根据用户输入，它可能是大约 100 个带有大

<select>

语句的输入字段和许多自定义指令。 客户要求以这种方式进行，我想确保所有这些都在路由过程中得到处理。

为了澄清问题：$templateCache 仅存储磁盘上出现的部分，不存储路由或渲染信息？

Answer 1

默认情况下，加载模板时，Angular 会查找 $templateCache 内部，并在无法在 $templateCache 本地找到模板时通过 XHR 获取模板。 当 XHR 请求很慢或者我们的模板足够大时，它可能会对最终用户的体验产生严重的负面影响。 我们可以通过将模板缓存加载到 JavaScript 文件中并将 JavaScript 文件与应用程序的其余部分一起发送来伪造模板缓存加载，而不是获取模板 XHR。

样品：

angular.module('myApp')
.run(['$templateCache', function($templateCache) {
$templateCache.put('xyz.html', ...);
}]);

因此，除非您非常确定从 $templateCache 中删除缓存的模板，否则不要这样做。

Answer 2

如果我没记错的话，它是一个保存部分的对象。当向任何 html 文件发出请求时（通过路由、指令或包含），Angular 首先查看

$templateCache

，如果所需文件不存在，它将发出请求并将其放入缓存中。但如果它确实存在，则从那里获取。因此，如果您每页使用指令 100 次，它只会对您的指令文件发出一次请求，或者如果您来回导航应用程序，它不会请求已加载的文件。

在每个控制器上添加

$templateCache.removeAll();

有意义吗？仅当它是非常小的应用程序时，否则我建议不要乱用它。