我有一个问题在angular.js的指令/类ng-斗篷或ng-show。
Chrome运行正常,但Firefox使用ng-cloak或ng-show导致元素闪烁。 恕我直言,这是由于将ng-cloak/ng-show转换为style="display: none;",可能Firefox javascript编译器有点慢,所以元素出现一段时间,然后隐藏?
例子:
<ul ng-show="foo != null" ng-cloak>..</ul>
我有一个问题在angular.js的指令/类ng-斗篷或ng-show。
Chrome运行正常,但Firefox使用ng-cloak或ng-show导致元素闪烁。 恕我直言,这是由于将ng-cloak/ng-show转换为style="display: none;",可能Firefox javascript编译器有点慢,所以元素出现一段时间,然后隐藏?
例子:
<ul ng-show="foo != null" ng-cloak>..</ul>
当前回答
你最好参考angular文档,因为版本[1.4.9]已经更新到下面,使得它可以支持data-ng-cloak指令。
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
其他回答
我会用<div ng-cloak>包裹<ul>
试着关闭Firebug。我是认真的。这对我很有帮助。
应用已接受的答案,然后确保Firefox中的Firebug已关闭:按F12,然后关闭此页的Firebug -右上角的小按钮。
我尝试了这里发布的每一个解决方案,仍然在Firefox中闪烁。
如果它有助于任何人,我通过添加style="display: none;"到主要内容div,然后使用jQuery(我已经在页面上使用它)$('#main-div-id').show();一旦从服务器获取数据后加载了所有内容;
最好使用ng-if而不是ng-show。ng-if完全删除并重新创建DOM中的元素,并有助于避免ng-shows闪烁。
我在使用ngCloak时从未有过太多的运气。尽管上面提到了一切,我仍然会看到闪烁。避免弹移的唯一可靠方法是将内容放在模板中并包含该模板。在SPA中,唯一在被Angular编译之前会被评估的HTML是你的主index.html页面。
只需要把身体里的所有东西都放在一个单独的文件里,然后:
<ng-include src="'views/indexMain.html'"></ng-include>
这样你就不会看到任何闪烁,因为Angular会在将模板添加到DOM之前对其进行编译。