用法描述

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. WebSocket 服务器3

    其实,在服务器的选择上很广,基本上,主流语言都有WebSocket的服务器端实现,而我们作为前端开发工程师,当然要选择现在比较火热的NodeJS作为我们的服务器端环境了.NodeJS本身并没有原生的W ...

  2. [CareerCup] 11.1 Merge Arrays 合并数组

    11.1 You are given two sorted arrays, A and B, where A has a large enough buffer at the end to hold ...

  3. LeetCode:Gray Code(格雷码)

    题目链接 The gray code is a binary numeral system where two successive values differ in only one bit. Gi ...

  4. LeetCode 笔记25 Candy (艰难的调试)

    There are N children standing in a line. Each child is assigned a rating value. You are giving candi ...

  5. swift语言的学习笔记

    swift参考了OC,Rust,Haskell,Ruby,Python,C#等语言的特性.首先,学习这门语言是速学的,我不想浪费太多时间在笔记这门语言和其他语言的哪里不同,特性你自己亲自实践就知道了. ...

  6. Flex的正则表达式匹配速度与手工代码的比较

    flex是一个词法分析器生成器,它是编译器和解释器编程人员的常用工具之一.flex的程序主要由一系列带有指令(称为动作代码)的正则表达式组成.在匹配输入时,flex会将所有的正则表达式翻译成确定性有穷 ...

  7. 运用Java对微信公众平台二次开发技术——开发者模式接入

    当初我在这碰到了很多问题,市面上以及网络上的资料特别少,所以当初碰了很多壁,所以现在跟大家分享一下,如何用Java,对微信公众平台进行二次开发. 一.开发预备知识: 最基本的JavaSE与JavaWe ...

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

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

  9. Android Studio之gradle的配置与介绍

    1.gradle的简单介绍 Gradle是可以用于Android开发的新一代的Build System,也是Android Studio默认的build工具.其实Gradle脚本是基于一种JVM语言- ...

  10. 我的第二个app上线:术购管家

    忙了两周写完的app,终于发布了,可是等上线竟然等了两周多,今天终于上线了,一路顺畅,没有被打回过...