如何使用ng-hide隐藏div而不会闪烁

Question

Am using ng-hide to hide a div. it display when dom loaded and hides after a milli second.

 <div class="container" ng-hide = "{{flag}}">

how to make the div hidden without flicker

Answer 1

You can use ng-if - in this case if the result of your condition is false then there wouldn't be a div element at all in the DOM.

ng-hide uses CSS (afaik) to hide the specific element but the element is still put inside the DOM. The CSS is applied after the DOM rendering - that is why you see this "flickering"

Answer 2

<div class="container" ng-hide="{{flag}}" ng-cloak>

默认情况下隐藏，直到您的DOM被编译为止

Answer 3

您还可以使用ng-show="{{flag}}"来根据标志显示div，如果flag为false，则不会显示div，否则会显示。