關於ng-cloak解決閃現問題的一點坑

angular的頁面可以使用{{express}}來執行表達式，但是瀏覽器的加載速度太快時，頁面會出現{{}}這樣的閃現，網上的解決方案大都是兩種，

ng-cloak和ng-bind，兩種方式的具體用法這里不再詳述，網上都是，這里主要寫下自己碰到的坑。

 

使用ng-cloak時，如果頁面上有多個元素用了ng-cloak，此時就會出現問題，當其中一個元素已經加載完畢，angular就會把所有ng-cloak去除掉，

導致其他元素展示出來，包括未執行的{{}}，我們想要解決的閃現問題又出現了，所以最好的解決方法是使用ng-bind。

 

但是，我的頁面上元素太多，使用{{}}的頁面也多，只能考慮其他方案，千辛萬苦總算找到一種解決方法$viewContentLoaded

<!--CSS代碼-->
.my-cloak {
  display : none !important    
}

<!--HTML代碼-->
<div class="my-cloak">
</div>

<!--JS代碼-->
$scope.$watch("$viewContentLoaded", function() {
   angular.element(".my-cloak").removeClass("my-cloak"); 
})

這個方法的壞處就是頁面的所有元素加載完之前，頁面是空白的……，所有最好的方法還是使用ng-bind。