我有一个问题在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>
当前回答
我正在使用ionic框架,添加css样式可能在某些情况下不工作,你可以尝试使用ng-if而不是ng-show / ng-hide
裁判:https://books.google.com.my/books?id=-_5_CwAAQBAJ&pg=PA138&lpg=PA138&dq=ng-show +隐藏+闪烁+ + ios&source = bl&ots = m2Turk8DFh&sig = 8 hniwx26eugr2k_weyavzdixj8k&hl = en&sa = X&redir_esc = y v = onepage&q = ng-show % 20号隐藏% 20闪烁% 20 % 20 ios&f = false
其他回答
我会用<div ng-cloak>包裹<ul>
实际上,我发现Rick Strahl's Web Log的建议完美地解决了我的问题(因为我仍然有ng-cloak有时会闪烁原始{{code}}的奇怪问题,特别是在运行Firebug时):
核心选项:手动隐藏内容
使用显式CSS是最好的选择,所以下面的内容应该是不必要的。但我在这里提到它,因为它提供了一些见解,如何在其他框架或自己的基于标记的模板加载时手动隐藏/显示内容。
在我搞清楚我可以显式地将CSS样式嵌入到页面之前,我曾试图弄清楚为什么ng-cloak没有完成它的工作。在浪费了一个小时的时间后,我最终决定手动隐藏并显示容器。想法很简单——最初隐藏容器,然后在Angular完成初始处理并从页面中删除模板标记后显示它。
你可以手动隐藏内容,并在Angular获得控制权后使其可见。为此,我使用:
<div id="mainContainer" class="mainContainer boxshadow"
ng-app="app" style="display:none">
注意display: none样式,它显式地隐藏了页面上最初的元素。
一旦Angular运行了初始化,并有效地处理了页面上的模板标记,你就可以显示内容了。对于Angular来说,这个' ready '事件就是app.run()函数:
app.run( function ($rootScope, $location, cellService) {
$("#mainContainer").show();
…
});
这有效地删除了display:none样式和内容显示。当app.run()触发时,DOM已经准备好显示已填充的数据,或者至少是空数据——Angular已经获得了控制权。
试着关闭Firebug。我是认真的。这对我很有帮助。
应用已接受的答案,然后确保Firefox中的Firebug已关闭:按F12,然后关闭此页的Firebug -右上角的小按钮。
不管怎样,我也遇到过类似的问题,斗篷不能用。也许有必要检查你的应用/站点是否启用了缓存来重用源文件,看看是否有帮助。
随着我与闪烁的磨合,我在DevTools打开和缓存禁用的情况下进行测试。离开面板关闭缓存启用固定我的问题。
你最好参考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;
}