AngularJS ng-switch 指令

AngularJS 參考手冊(cè)

根據(jù)選中的值顯示對(duì)應(yīng)部分:

<div ng-switch="myVar">
  <div ng-switch-when="youj">
     <h1>W3Cschool教程</h1>
     <p>歡迎訪問(wèn)W3Cschool教程</p>
  </div>
  <div ng-switch-when="google">
     <h1>Google</h1>
     <p>歡迎訪問(wèn)Google</p>
  </div>
  <div ng-switch-when="taobao">
     <h1>淘寶</h1>
     <p>歡迎訪問(wèn)淘寶</p>
  </div>
  <div ng-switch-default>
     <h1>切換</h1>
     <p>選擇不同選項(xiàng)顯示對(duì)應(yīng)的值。</p>
  </div>
</div>

嘗試一下 ?

定義和用法

ng-switch 指令根據(jù)表達(dá)式顯示或隱藏對(duì)應(yīng)的部分。

對(duì)應(yīng)的子元素使用 ng-switch-when 指令，如果匹配選中選擇顯示，其他為匹配的則移除。

你可以通過(guò)使用 ng-switch-default 指令設(shè)置默認(rèn)選項(xiàng)，如果都沒(méi)有匹配的情況，默認(rèn)選項(xiàng)會(huì)顯示。

語(yǔ)法

<form> 元素支持該屬性。

參數(shù)值

AngularJS 參考手冊(cè)