问题描述
我有一些控制器,不应该被初步显示出一个角的js应用。他们在屏幕上闪烁,尽管我用NG-斗篷。这个问题似乎是,编译被调用,并删除NG-斗篷指令和类,这使得控制器的内容可见,即使它不应该是因为NG-节目是假的。
如果我在暂停NG-斗篷的编译方法JS执行,我可以看到作为NG-斗篷指令被删除的元素出现。如果我在控制器暂停执行JS(例如在$ scope.visible = FALSE;),我可以看到该控制器停留在页面上可见。该控制器然后再看不见的,它应该是在装载晚些时候。
- 我加载我app.js和angular.js在文档HEAD
- 我有我的CSS文档的HEAD
- 我已经包含在NG-斗篷CSS规则!重要的在我的外部CSS和内联
我怎样才能prevent这个闪烁?为什么不NG-斗篷瞻仰纳克出现?
index.html的:
< DIV NG-披风类=NG-斗篷NG控制器=RoomsControllerNG-秀=看得见>
< H1>这闪烁,可以看出,如果我们在控制器JS设置一个断点,或angular.js&LT的NG-斗篷指令的编译方法之后; / H1>
< / DIV>
app.js:
app.controller('RoomsController',['$范围',
功能($范围){
$ scope.visible = FALSE;
}
]);
我复制你的问题,并为我工作的事情是创造内在 DIV
和使用 NG-如果
指令而不是 NG-节目
。我希望它能帮助。
< DIV数据-NG-控制器=RoomsController>
< DIV NG-披风类=NG-斗篷数据-NG-IF =看得见>
某些文本
< / DIV>
< / DIV>
I have an angular-js app with some controllers that shouldn't be shown initially. They flash on the screen despite my use of ng-cloak. The problem seems to be that compile gets called and removes the ng-cloak directives and class, this makes the controllers contents visible even though it shouldn't be because ng-show is false.
If I pause js execution in ng-cloak's compile method I can see the elements appear as the ng-cloak directive is removed. If I pause js execution in the controller (for example on "$scope.visible = false;") I can see the controller stays visible on the page. The controller is then invisible again as it should be sometime later in loading.
- I am loading my app.js and angular.js in the document HEAD
- I have my css in the document HEAD
- I have included the ng-cloak css rule with "!important" in my external css and inline
How can I prevent this flashing? Why doesn't ng-cloak pay respect to ng-show?
index.html:
<div ng-cloak class="ng-cloak" ng-controller="RoomsController" ng-show="visible">
<h1>This flashes, it can be seen if we set a breakpoint in the controller js, or after the ng-cloak directive's compile method in angular.js</h1>
</div>
app.js:
app.controller('RoomsController', ['$scope',
function ($scope) {
$scope.visible = false;
}
]);
I've reproduced your issue and the thing that worked for me was to create inner div
and use ng-if
directive instead of ng-show
. I hope it helps.
<div data-ng-controller="RoomsController">
<div ng-cloak class="ng-cloak" data-ng-if="visible" >
Some text
</div>
</div>
这篇关于NG-披风指令被太早清除的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!