尽管ng-cloak,AngularJS在编译之前显示模型文本

时间:2016-06-15 14:05:43

标签: javascript angularjs performance ngcloak

我正在开发一个必须在嵌入式android系统上运行的页面(在系统webview中),这个东西很慢。实际上这么慢,当你加载一个页面时,在AngularJS更新所有绑定之前,模型文本仍然会在页面上停留半秒钟。这很烦人,显然是不可取的。

我已将ng-cloak添加到页面元素的无穷无尽的排列中。我还在样式表中添加了以下样式:

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

它只是不想隐藏内容,我认为离子是罪魁祸首。我不太了解AngularJS,我尝试编写一个指令my-cloak,它在编译和预链接时为元素添加了一个类,并在post link上删除了它。它工作得更好,但总是不起作用。

我已经阅读了一些我可以做的更多事情,例如“装饰”插值函数(超出我的深度),也许可以列出here列出的各种建议之一(如evalAsync或类似的东西)但是我不太了解Angular了解这些解决方案实际上做了什么。转换到AngularJS时,来自jQuery背景非常困难。

所以任何帮助都会非常感激。我只是想防止未消化的文本在屏幕上显示,基本上做了ng-cloak应该做的但是对于较慢的系统。谢谢!

1 个答案:

答案 0 :(得分:1)

这不是您正在寻找的答案,但有一个很好的做法来编写

<span ng-bind="data">&nbsp;</span> 

(所以没有{{data}}闪烁)。

  • ng-cloak样式已在页面上显示。使用angular app查看呈现页面的标题。

  • 你可以这样做:

<body ng-show="loaded"></body>并在加载数据后在控制器中设置scope.loaded = true