angularjs - 无法让 ng-cloak 工作

Question

I have a custom directive where I present the values in it using {{}} but the problem is when the page is reloading I get to see {{}} there before setting the values. I tried using ng-cloak but too bad it is not working for me. After googling this I found an article stating that the problem might be timing: that angular takes time to use ng-cloak when loading large contents. Is this right? Do I have to change anything in my settings? Is there a value I should pass to ng-cloak?

Here's my custom directive

<button ng-click="myCtrl.clicked()" ng-hide="myCtrl.conditionOne" ng-disabled="myCtrl.conditionTwo" class="{{myCtrl.class}}" ng-cloak>
    {{myCtrl.value}}
</button>

Answer 1

直接来自角度文档：

为获得最佳效果，必须在 html 文档的 head 部分加载 angular.js 脚本；或者，上面的 css 规则必须包含在应用程序的外部样式表中。

该可选规则是：

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { 
    display: none !important; 
}

Answer 2

通常，当ng-cloak“不工作”时，是由于没有随附的 CSS：

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}