Улучшить эту документацию Просмотреть исходный код ngInclude
- директива в модуле ng
Загружает, компилирует и включает внешний фрагмент HTML.
По умолчанию URL шаблона ограничен тем же доменом и протоколом, что и документ приложения. Это делается с помощью вызова $sce.getTrustedResourceUrl на нём. Для загрузки шаблонов с других доменов или протоколов можно либо добавить их в белый список, либо обработать их как доверенные значения. Обратитесь к жесткой защите контекста выполнения Angular.
Кроме того, политика браузера Same Origin Policy и политика Cross-Origin Resource Sharing (CORS) могут дополнительно ограничить успешную загрузку шаблона. Например, ngInclude не будет работать для междоменных запросов во всех браузерах, и для file:// доступа в некоторых браузерах.
Информация о директиве
- Эта директива создаёт новый scope.
- Эта директива выполняется на уровне приоритета 400.
Использование
- как элемент: (Эта директива может быть использована как пользовательский элемент, но имейте в виду ограничения IE).
<ng-include src="string" [onload="string"] [autoscroll="string"]> ... </ng-include>
- как атрибут:
<ANY ng-include="string" [onload="string"] [autoscroll="string"]> ... </ANY>
- как класс CSS:
<ANY class="ng-include: string; [onload: string;] [autoscroll: string;]"> ... </ANY>
Анимации
| Анимация | Происходит |
|---|---|
| enter | при изменении выражения, для новой вставки |
| leave | при изменении выражения, для старой вставки |
Анимации enter и leave происходят одновременно.
Нажмите здесь, чтобы узнать больше о этапах анимации.Аргументы
| Параметр | Тип | Подробности |
|---|---|---|
| ngInclude | src | string | Выражение Angular, вычисляемое в URL. Если источник является строковой константой, убедитесь, что вы заключили её в одинарные кавычки, например |
| onload (необязательно) | string | Выражение, вычисляемое при загрузке нового фрагмента. Примечание: При использовании onload на SVG-элементах в IE11 браузер попытается вызвать функцию с именем onload на элементе window, что, как правило, приведёт к ошибке "функция не определена". Для исправления можно использовать data-onload или другой вариант, который соответствует onload. |
| autoscroll (необязательно) | string | Указывает, должен ли - If the attribute is not set, disable scrolling. - If the attribute is set without value, enable scrolling. - Otherwise enable scrolling only if the expression evaluates to truthy value. |
События
-
$includeContentRequested
Выдаётся каждый раз при запросе содержимого ngInclude.
Тип:
emitЦель:
scope, в котором ngInclude был объявленПараметры
Параметр Тип Подробности angularEvent ObjectСинтетический объект события.
src StringURL загружаемого содержимого.
-
$includeContentLoaded
Выдаётся каждый раз при перезагрузке содержимого ngInclude.
Тип:
emitЦель:
текущий scope ngIncludeПараметры
Параметр Тип Подробности angularEvent ObjectСинтетический объект события.
src StringURL загружаемого содержимого.
-
$includeContentError
Выдаётся, когда HTTP-запрос шаблона возвращает ошибочный ответ (статус < 200 || статус > 299)
Тип:
emitЦель:
scope, в котором ngInclude был объявленПараметры
Параметр Тип Подробности angularEvent ObjectСинтетический объект события.
src StringURL загружаемого содержимого.
© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.5.11/docs/api/ng/directive/ngInclude