Spec-Zone.ru › Angular.js 1.6

Улучшить эту документацию Просмотреть исходный код 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–2018 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.6.9/docs/api/ng/directive/ngCloak

Spec-Zone.ru

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