AngularJS ng-switchディレクティブ

AngularJS リファレンスマニュアル

選択された値に応じて対応する部分を表示します:

<div ng-switch="myVar">
  <div ng-switch-when="サンプル">
     <h1>サンプル</h1>
     <p>欢迎访问サンプル</p>
  </div>
  <div ng-switch-when="google">
     <h1>Google</h1>
     <p>欢迎访问Google</p>
  </div>
  <div ng-switch-when="taobao">
     <h1>淘宝</h1>
     <p>欢迎访问淘宝</p>
  </div>
  <div ng-switch-default>
     <h1>切换</h1>
     <p>选择不同选项显示对应的值。</p>
  </div>
</div>

試してみる »

定義と使い方

ng-switchディレクティブは式に基づいて対応する部分を表示または非表示にします。

対応する子要素にはng-switch-whenディレクティブを使用します。一致する場合は選択されて表示され、一致しない場合は削除されます。

使用することでデフォルトオプションを設定できますng-switch-defaultディレクティブでデフォルトオプションを設定します。すべてが一致しない場合、デフォルトオプションが表示されます。

構文

<form> 要素はこの属性をサポートします。

パラメータ値

AngularJS リファレンスマニュアル