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>Cars</h1>
    <p>Read about cars.</p>
  </div>
  <div ng-switch-default>
    <h1>Switch</h1>
    <p>Select a topic from the dropdown to switch the content of this DIV.</p>
  </div>
</div>

Try It Yourself

Syntax

<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>

All HTML elements support.

Parameters