В Angular шаблоны пишутся с помощью HTML, содержащего элементы и атрибуты, специфичные для Angular. Angular объединяет шаблон с информацией из модели и контроллера для отображения динамической страницы, которую пользователь видит в браузере.
Вот типы элементов и атрибутов Angular, которые вы можете использовать:
- Директива — атрибут или элемент, который дополняет существующий элемент DOM или представляет собой повторно используемый компонент DOM.
-
Разметка — обозначение с двойными фигурными скобками
{{ }}для привязки выражений к элементам — встроенная разметка Angular. - Фильтр — форматирует данные для отображения.
- Элементы управления формами — проверяют ввод пользователя.
Следующий фрагмент кода демонстрирует шаблон с директивами и привязками к выражениям в фигурных скобках:
<html ng-app>
<!-- Body tag augmented with ngController directive -->
<body ng-controller="MyController">
<input ng-model="foo" value="bar">
<!-- Button tag with ng-click directive, and
string expression 'buttonText'
wrapped in "{{ }}" markup -->
<button ng-click="changeFoo()">{{buttonText}}</button>
<script src="angular.js">
</body>
</html>
В простом приложении шаблон состоит из HTML, CSS и директивы Angular, содержащихся в одном HTML-файле (обычно index.html).
В более сложном приложении вы можете отображать несколько представлений на одной главной странице, используя «части» — фрагменты шаблона, расположенные в отдельных HTML-файлах. Вы можете использовать директиву ngView для загрузки частей на основе конфигурации, переданной службе $route. В учебнике по Angular эта техника демонстрируется на шагах семь и восемь.
Связанные темы
Связанный API
© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.3.20/docs/guide/templates
