我使用AngularJS来"包括"在我的网络应用程序中的HTML部分。我为此使用了嵌套ng-include
。
我最外面的ng-include
也有动画。一切正常。唯一的问题是首先加载外部ng-include
模板。然后,包含的HTML文件也有一个ng-include
,它还会加载一个HTML文件。
最后包含的HTML文件会导致div突然扩大,这会使动画看起来很神奇。
如果可以以某种方式预加载所有嵌套的ng-includes
,则可以解决此问题。在AngularJS中是否可以这样?
我的代码看起来像这样:
我的主要观点:
<div class="animation-grow-in animation-grow-out" ng-repeat="myList">
<div ng-include"base-partial.html"></div>
</div>
base-partial.html文件:
<div ng-switch="myList.type">
<div ng-switch-when="file1">
<div ng-include="'file1.html'"></div>
</div>
<div ng-switch-when="file2">
<div ng-include="'file2.html'"></div>
</div>
</div>
file1.html
和file2.html
包含表单。
但是因为filex.html
加载了一个延迟使得它看起来都很尖锐。那么这个问题有解决方案吗?我可以预加载所有嵌套的ng-includes
吗?
答案 0 :(得分:5)
您可以使用angularjs模板缓存服务来缓存模板。当启动捆绑应用程序时,将所有模板放在缓存中,这样就不会对模板进行XHR调用。
https://docs.angularjs.org/api/ng/service/ $ templateCache