我有一个问题在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>
当前回答
我尝试了这里发布的每一个解决方案，仍然在Firefox中闪烁。
如果它有助于任何人，我通过添加style="display: none;"到主要内容div，然后使用jQuery(我已经在页面上使用它)$('#main-div-id').show();一旦从服务器获取数据后加载了所有内容;
其他回答
避免断行
<meta http-equiv="Content-Security-Policy" content="
default-src 'FOO';
script-src 'FOO';
style-src 'FOO';
font-src 'FOO';">
适用于Firefox 45.0.1
<meta http-equiv="Content-Security-Policy" content=" default-src 'FOO'; script-src 'FOO'; style-src 'FOO'; font-src 'FOO';">
ngBind和ngBindTemplate是不需要CSS的替代品:
<div ng-show="foo != null" ng-cloak>{{name}}</div> <!-- requires CSS -->
<div ng-show="foo != null" ng-bind="name"></div>
<div ng-show="foo != null" ng-bind-template="name = {{name}}"></div>
正如在文档中提到的，你应该添加一个规则到你的CSS来隐藏它基于ng-cloak属性:
[ng\:cloak], [ng-cloak], .ng-cloak {
display: none;
}
我们在“用Angular构建”网站上使用了类似的技巧，你可以在Github上查看源代码:https://github.com/angular/builtwith.angularjs.org
希望有帮助!
除了其他答案，如果你发现模板代码的闪光仍然发生，这可能是你的脚本在页面的底部，这意味着ng-cloak指令将不会直接工作。您可以将脚本移到头部，也可以创建CSS规则。
文档说:“为了达到最好的效果，angular.js脚本必须加载在html文档的头部部分;或者，上面的CSS规则必须包含在应用程序的外部样式表中。”
现在，它不必是一个外部样式表，而只是在头部的一个元素中。
<style type="text/css">
.ng-cloak {
display: none !important;
}
</style>
来源:https://docs.angularjs.org/api/ng/directive/ngCloak
你最好参考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;
}
