директива ngCloak не работает

Question

я использовал директиву ngCloak как этот

<div ng-repeat="note in ctrl.notes1"> 
     <span class="ng-cloak">{{note.$$hashKey}}</span> 
     <span class="label" ng-bind="note.label"></span> 
     <span class="author" ng-bind="note.done"></span> 
</div> 

При обновлении страницы он показывает Неоткомпилированные исходные данные, как {{примечание. $ Hashkey}}. Я не знаю, что я делаю неправильно.

Answer 1

Вы можете добавить следующие правила CSS в раздел head вашего html-файла, чтобы гарантировать, что правила доступны сразу при загрузке.

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

В противном случае они будут активированы при загрузке angular.js файл, который, как правило, слишком поздно, чтобы предотвратить отображение исходных шаблонов.

Answer 2

Правила css, которые делают работу ng-cloak встроены в файл angular.js. Поэтому, если он включен в конец html-файла, он может работать не так, как ожидалось.

Вы можете это исправить, перемещая следующий сценарий тег в головной части вашего HTML:

<script src="angular.js"></script> 

Или вы можете добавить следующие правила CSS в файл CSS, включенных в головной части HTML:

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