有没有办法避免AngularJS在页面加载之前显示所有隐藏的元素？

Question

6

所有带有ng-hide属性的元素在页面加载前都是可见的（Angular会将它们隐藏）——这会导致奇怪的网页外观。在使用jQuery时，我习惯设置style="display:none"并在js完成后显示它们。

在AngularJS中是否做错了什么？或者有更好的解决方法吗？

非常感谢！

以下是页面在加载时显示所有隐藏元素的示例： enter image description here

- Eduardo Rosa

1

https://docs.angularjs.org/api/ng/directive/ngCloak - Mike Robinson

1

我没有尝试过，但这看起来可能会做你想要的事情。 https://dev59.com/VmQn5IYBdhLWcg3wGUAX. - George S

4个回答

4

请看 ng-cloak，它能防止页面闪烁。具体信息请查看https://docs.angularjs.org/api/ng/directive/ngCloak。

- Mike

2

请查看这份官方文档： https://docs.angularjs.org/api/ng/directive/ngCloak 将此指令添加到您的body标签中，并在开头或直接在HTML中包含自定义CSS。

- Houssem Fathallah

-5

感谢所有完美的答案。

ng-cloak可以解决问题：

记住这个建议：

该指令可应用于整个页面，但首选用法是将多个ngCloak指令应用于页面的小部分，以允许浏览器视图的渐进式呈现。

- Eduardo Rosa

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Vineet · Accepted Answer

试试看

<div ng-app ng-cloak>
//Code 
</div>

该指令被用于防止网页在加载时显示未渲染的模板。通过它，我们可以添加CSS样式，以隐藏需要等待AngularJS编译后才能正确显示的HTML元素。