当IE中存在大量要加载的图像/脚本时,它似乎主要是一个问题,{{stringExpression}}标记中文字的显示时间可能会很长,然后一旦完成角度的编译/插值就会消失.该文件.
有没有一个共同的原因,为什么会发生这种情况,这表明我做的事情总体上是错误的,或者是否有一种已知的方法来阻止这种情况?
pko*_*rce 281
我认为您正在寻找该ngCloak指令:https://docs.angularjs.org/api/ng/directive/ngCloak
从文档:
ngCloak指令用于防止浏览器在加载应用程序时以原始(未编译)形式短暂显示Angular html模板.使用此指令可避免html模板显示导致的不良闪烁效应.
该指令可以应用于
<body>元素,但首选用法是将多个ngCloak指令应用于页面的小部分,以允许逐步呈现浏览器视图
And*_*lin 196
此外,您可以使用<span ng-bind="hello"></span>而不是{{hello}}.
LOA*_*OAS 51
要在最后加载脚本时提高class ='ng-cloak'方法的有效性,请确保在文档的头部加载以下css:
.ng-cloak { display:none; }
Run Code Online (Sandbox Code Playgroud)
Ben*_*wee 39
只需将隐藏的CSS添加到页面的头部或一个CSS文件中:
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide {
display: none !important;
}
Run Code Online (Sandbox Code Playgroud)
然后你可以根据正常的Angular实践使用ngCloak指令,它甚至可以在加载Angular之前工作.
这正是Angular所做的:angular.js末尾的代码将上述CSS规则添加到页面的头部.
小智 21
在你的CSS中添加以下内容
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
Run Code Online (Sandbox Code Playgroud)
然后在你的代码中你可以添加ng-cloak指令.例如,
<div ng-cloak>
Welcome {{data.name}}
</div>
Run Code Online (Sandbox Code Playgroud)
而已!
小智 6
您也可以使用ng-attr-src="{{variable}}"而不是,src="{{variable}}"只有在编译器编译模板后才会生成属性.这在文档中提到:https://docs.angularjs.org/guide/directive#-ngattr-attribute-bindings