Инструкция 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 Выражение, удаляющее элементы без соответствия и отображающее элементы с соответствием.