×
AngularJS 教程AngularJS 简介AngularJS 表达式AngularJS 指令AngularJS 模型AngularJS Scope(作用域)AngularJS 控制器AngularJS 过滤器AngularJS ServiceAngularJS HttpAngularJS SelectAngularJS 表格AngularJS SQLAngularJS HTML DOMAngularJS 事件AngularJS 模块AngularJS 表单AngularJS 输入验证AngularJS APIAngularJS BootstrapAngularJS 包含AngularJS 动画AngularJS 依赖注入AngularJS 路由AngularJS 应用AngularJS 实例AngularJS 参考手册

AngularJS ng-switch 指令


AngularJS 参考手册AngularJS 参考手册


根据选中的值显示对应部分:

<div ng-switch="myVar">
  <div ng-switch-when="runoob">
     <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 指令设置默认选项,如果都没有匹配的情况,默认选项会显示。


语法

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

<form> 元素支持该属性。


参数值

描述
expression 表达式会让匹配项显示,不匹配项移除。

AngularJS 参考手册AngularJS 参考手册


分类导航

关注微信下载离线手册

bootwiki移动版 bootwiki
(群号:472910771)