我有一个菜单,当一些按钮被cliked幻灯片,但开始这个菜单是隐藏的,像这样:
<div ng-show="menuShow"> my menu here... </div>
问题是当页面加载时菜单不被隐藏(可能是因为没有加载ngShow指令),然后它们消失(可能是因为ngShow指令被加载),并且与菜单进行了一个奇怪的“闪烁效应”.
处理这个问题的最好办法是什么?
最快最简单的做法是将
ngCloak
指令添加到元素中.
<div ng-show="menuShow" ng-cloak> my menu here... </div>
只要Angular在文档的头部同步加载,这样可以防止闪烁.
如果您没有同步加载角度,那么according to the docs,您可以手动将CSS添加到页面:
[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak { display: none !important; }
如果由于某种原因不可能,您可以将初始加载中的所有Angular内容都放在页面中,但包含ng-include,ng-view或ui-view指令或自定义指令自己的模板. (这是我怎么做,但是更多的结构性原因)