Инструкция AngularJS ng-switch
Определение и использование
ng-switch
Инструкция позволяет скрывать/показывать элементы HTML на основе выражения.
Если подэлементы проходят через ng-switch-when
Инструкция показывает элемент с ng-switch-when
подэлементы инструкции, в противном случае элемент и все его подэлементы будут удалены.
Вы также можете использовать ng-switch-default
Инструкции определяют базовую часть, чтобы показывать её, если другие части не совпадают.
Пример
Показывается часть HTML только при совпадении с определенным значением:
<div ng-switch="myVar"> <div ng-switch-when="dogs"> <h1>Собаки</h1> <p>Добро пожаловать в мир собак.</p> </div> <div ng-switch-when="tuts"> <h1>Учебники</h1> <p>Учитеся по примерам.</p> </div> <div ng-switch-when="cars"> <h1>Машины</h1> <p>Прочитайте о машинах.</p> </div> <div ng-switch-default> <h1>Переключатель</h1> <p>Выберите тему из выпадающего списка, чтобы изменить содержимое этого DIV.</p> </div> </div>
Грамматика
<element ng-switch="expression"> <element ng-switch-when="value"></element> <element ng-switch-when="value"></element> <element ng-switch-when="value"></element> <element ng-switch-default></element> </element>
Все элементы HTML поддерживают.
Параметры
Параметры | Описание |
---|---|
expression | Выражение, удаляющее элементы без соответствия и отображающее элементы с соответствием. |