Spec-Zone.ru › Angular.js 1.8

Улучшить эту документацию Посмотреть исходный код ngCloak

  1. директива в модуле ng

Обзор

Директива ngCloak используется для предотвращения кратковременного отображения HTML-шаблона AngularJS браузером в сыром (нескомпилированном) виде во время загрузки вашего приложения. Используйте эту директиву, чтобы избежать нежелательного эффекта мерцания, вызванного отображением HTML-шаблона.

Директиву можно применить к элементу <body>, но предпочтительнее применять несколько директивы ngCloak к небольшим частям страницы, чтобы обеспечить поэтапное отображение браузера.

ngCloak работает в сотрудничестве с следующим правилом CSS, вставленным в angular.js и angular.min.js. Для режима CSP добавьте angular-csp.css в ваш HTML-файл (см. ngCsp).

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

Когда браузер загружает это правило CSS, все HTML-элементы (включая их потомков), помеченные директивой ngCloak, скрываются. Когда AngularJS встречает эту директиву во время компиляции шаблона, она удаляет атрибут элемента ngCloak, делая скомпилированный элемент видимым.

Для наилучшего результата, скрипт angular.js должен быть загружен в секцию head HTML-документа; в качестве альтернативы, правило CSS выше должно быть включено во внешнем стиле приложения.

Информация о директиве

  • Эта директива выполняется на уровне приоритета 0.

Использование

  • как атрибут:
    <ANY
      ng-cloak>
    ...
    </ANY>
  • как класс CSS:
    <ANY class="ng-cloak"> ... </ANY>

Пример

© 2010–2020 Google, Inc.
Licensed under the Creative Commons Attribution License 3.0.
https://code.angularjs.org/1.8.2/docs/api/ng/directive/ngCloak

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API