Spec-Zone.ru › Angular.js 1.2

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

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

Директива ngCloak используется для предотвращения кратковременного отображения Angular-шаблона браузером в его исходном (нескомпилированном) виде во время загрузки приложения. Используйте эту директиву, чтобы избежать нежелательного мерцания, вызванного отображением 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, скрываются. Когда Angular встречает эту директиву во время компиляции шаблона, он удаляет атрибут элемента ngCloak, делая скомпилированный элемент видимым.

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

Старые браузеры, такие как IE7, не поддерживают селектор атрибутов (добавлена в CSS 2.1), поэтому они не могут соответствовать селектору [ng\:cloak]. Чтобы обойти это ограничение, необходимо добавить CSS-класс ng-cloak дополнительно к директиве ngCloak, как показано в примере ниже.

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

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

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

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

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

Spec-Zone.ru

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