用法描述

ng-switch根据表达式的值显示或这隐藏对应部分。类似c#或者其他预览里面的switch用法。可以慢慢体会。

说道ng-switch就要说到子元素该怎么根据当前值进行变化。子元素可以通过:ng-switch-when指令,ng-switch-default指令来设置满足条件时,该子元素是隐藏或者显示。其实也很容易理解,当什么时,或者默认值。下面看一个例子。

例子

<select ng-model="myselect">
<option value="one">选择一</option>
<option value="two">选择二</option>
<option value="three">选择三</option>
</select>
<div ng-switch="myselect">
<div ng-switch-when="one">
<h1>one</h1>
<p>你选择了one</p>
</div>
<div ng-switch-when="two">
<h1>two</h1>
<p>你选择了two</p>
</div>
<div ng-switch-when="three">
<h1>three</h1>
<p>你选择了three</p>
</div>
</div>

结果

[Angularjs]ng-switch用法的更多相关文章

  1. 学习AngularJs:Directive指令用法

    跟我学AngularJs:Directive指令用法解读(上) http://blog.csdn.net/evankaka/article/details/51232895 跟我学AngularJs: ...

  2. 学习AngularJs:Directive指令用法(完整版)

    这篇文章主要学习AngularJs:Directive指令用法,内容很全面,感兴趣的小伙伴们可以参考一下   本教程使用AngularJs版本:1.5.3 AngularJs GitHub: http ...

  3. C# 枚举与switch用法

    using System; namespace Csharp { class Program { //枚举 public enum TimeOfDay { Morning=, Afternoon=, ...

  4. AngularJS中transclude用法详解

    这篇文章主要介绍了AngularJS中transclude用法,详细分析了transclude的具体功能.使用技巧与相关注意事项,需要的朋友可以参考下 本文实例讲述了AngularJS中transcl ...

  5. 转:AngularJS的Filter用法详解

    Filter简介 Filter是用来格式化数据用的. Filter的基本原型( '|' 类似于Linux中的管道模式): {{ expression | filter }} Filter可以被链式使用 ...

  6. AngularJS的Filter用法详解

    上一篇讲了自定义Directive,本篇是要讲到AngularJS的Filter. Filter简介 Filter是用来格式化数据用的. Filter的基本原型( '|' 类似于Linux中的管道模式 ...

  7. Java的switch用法

    下面是switch的用法: var status = msg;        switch (status)    //status是表达式        {            case 0:st ...

  8. AngularJS 'Controller As'用法

    AngularJS 1.2版本中提供了Controller As语法,简单说就是可以在Controller中使用this来替代$scope,使得Controller更像一个传统的JS类,相对于$sco ...

  9. SVN switch 用法详解

    一直知道SVN有个switch命令,但是对它的介绍教程却很少,大多是生硬的svn帮助文档里的文字,从而一直不怎么会用.今天看了这篇文章,突觉豁然开朗,整理下来以备查阅. 使用SVN,自然是需要与别人合 ...

  10. SVN switch 用法总结

    一直知道SVN有个switch命令,但是对它的介绍教程却很少,大多是生硬的svn帮助文档里的文字,从而一直不怎么会用.今天看了这篇文章,突觉豁然开朗,整理下来以备查阅. 使用SVN,自然是需要与别人合 ...

随机推荐

  1. DataTable数据集转换为List非泛型以及泛型方式

    前言 DataTable是断开式的数据集合,所以一旦从数据库获取,就会在内存中创建一个数据的副本,以便使用.由于在实际项目中,经常会将DataTable中的每行数据转换为Model,然后放到List集 ...

  2. Android 动画之ScaleAnimation应用详解

    本节讲解ScaleAnimation 动画, ScaleAnimation(float fromX, float toX, float fromY, float toY,int pivotXType, ...

  3. Python类库下载

    https://sourceforge.net/projects/pywin32/files/pywin32/ WMI库的安装 下载 http://timgolden.me.uk/python/wmi ...

  4. [CareerCup] 5.4 Explain Expression ((n & (n-1)) == 0) 解释表达式

    5.4 Explain what the following code does: ((n & (n-1)) == 0). 这道题让我们解释一个表达式((n & (n-1)) == 0 ...

  5. 20135202闫佳歆--week 7 深入理解计算机系统第七章--读书笔记

    参见上学期的学习笔记: http://www.cnblogs.com/20135202yjx/p/4836058.html

  6. linux实践——内核编程 基础模块

    一.内核模块的概念 Linux模块(module)是一些可以作为独立程序来编译的函数和数据类型的集合.内核模块给我们带来的便利是模块本身并不被编译进内核文件,可在内核运行期间动态的安装或卸载.因为如果 ...

  7. bt协议详解 DHT篇(上)

    bt协议详解 DHT篇(上) 最近开发了一个免费教程的网站,突然产生了仔细了解bt协议的想法,这篇文章是bt协议详解系列的第三篇,后续还会写一些关于搜索和索引的东西,都是在开发这个网站的过程中学习到的 ...

  8. MVVM开源框架Knot.js 教程1 - CBS初步

    Knotjs教程系列 1.CBS初步(本文) 2.Knot.js Debugger ....持续增加中 CBS初步 学习Knot.js,实际上就是学习如何使用CBS.CBS使用和CSS类似的原理,将绑 ...

  9. mysql使用基础 sql语句(一)

    csdn博文地址:mysql使用基础 sql语句(一)  点击进入 命令行输入mysql -u root -p,回车再输入密码,进入mysql. 终端命令以分号作为一条语句的结束,可分为多行输入,只需 ...

  10. AngularJS开发指南3:Angular主要组成部分以及如何协同工作

    AngularJS的主要组成部分是: 启动(startup) - 展示“hello world!” 执行期(runtime) - AngularJS 执行期概览 作用域(scope) - 视图和控制器 ...