当使用ng-show / -hide时,包含在这些块中的内容最初显示在用户屏幕上。只有几毫秒(在angular.js加载并执行之后),正确的块才会显示在ng-show中。
有没有更好的方法比ng-show / -hide只加载相关的数据部分到DOM?
ng-view的问题是我只能在页面上有一个,所以我必须根据当前状态切换DOM的许多部分的行为。
要避免“闪存未编译的内容”,请使用
ng-bind而不是{{}}或使用
ng-cloak:
<span ng-cloak ng-show="show">Hello,{{name}}!</span>
如果您使用ng-cloak,并且不在HTML的head部分中加载Angular.js,则需要将其添加到CSS文件中,并确保它在页面顶部加载:
[ng\:cloak],[ng-cloak],.ng-cloak { display: none; }
请注意,您只需在首页上使用这些指令。稍后提取的内容(例如,通过ng-include,ng-view等)将在浏览器呈现之前由Angular编译。
Is there a better way to load data other than ng-show / hide,in which only the relevant section is loaded into the DOM.
ng-show / ng-hide的一些替代方法是ng-include,ng-switch和(自v1.1.5起)ng-if:
<div ng-include src="someModelPropertySetToThePartialYouWantToLoadRightNow"></div>
有关ng-switch与ng-include配合使用的示例,另请参见http://stackoverflow.com/a/12584774/215945。
注意,ng-switch和ng-if添加/删除DOM元素,而ng-show / hide仅更改CSS(如果对您重要的话)。