ng-class中的if else判断
ng-class中的if else判断
来自于stackoverflow的一个问题,自己刚好用到,搬过来做个标记。原问题链接
在使用ng-class时,有些时候会碰到根据是否满足条件来设置元素的样式,使用以下方法可以达到这样的目的。
(1)使用运算符
- <div ng-class="variable == 1 ? 'class1' : (variable == 2 ? 'class2' : (variable ==3 ? 'class3' : 'class4'))">
- </div>
这样写无需在javascript中添加额外代码,但是需要注意的是要让代码具有良好的可读性。
(2)使用额外的方法
<div ng-class="setStyle(variable)"></div>
然后使用以下的代码:
$scope.setStyle = function(args) {
if(args == 1) return 'class1';
else if(args ==2)
return 'class2';
else if(args == 3)
return 'class3'; };
ng-class中的if else判断的更多相关文章
- 走进AngularJs(二) ng模板中常用指令的使用方式
通过使用模板,我们可以把model和controller中的数据组装起来呈现给浏览器,还可以通过数据绑定,实时更新视图,让我们的页面变成动态的.ng的模板真是让我爱不释手.学习ng道路还很漫长,从模板 ...
- bash Shell 中如何实现条件判断之if判断
http://blog.51cto.com/lovelace/1211353 bash中如何实现条件判断?条件测试类型: 整数测试 字符测试 文件测试 一.条件测试的表达式: ...
- centos shell脚本编程1 正则 shell脚本结构 read命令 date命令的用法 shell中的逻辑判断 if 判断文件、目录属性 shell数组简单用法 $( ) 和${ } 和$(( )) 与 sh -n sh -x sh -v 第三十五节课
centos shell脚本编程1 正则 shell脚本结构 read命令 date命令的用法 shell中的逻辑判断 if 判断文件.目录属性 shell数组简单用法 $( ) 和$ ...
- js中的数据类型和判断数据类型
js中的数据类型和判断数据类型 基本数据类型,六大基本数据类型:字符串(String).数字(Number).布尔(Boolean).对象(Object).空(Null).未定义(Undefined) ...
- linux Shell中常用的条件判断
linux Shell中常用的条件判断 -b file 若文件存在且是一个块特殊文件,则为真 -c file 若文件存在且是一个字符特殊文件,则为真 -d ...
- 6.6.1 F# 中函数调用的类型判断
6.6.1 F# 中函数调用的类型判断 尽管,在 F# 中能够用尖括号指定类型參数值.与 C# 中的方式同样.但这样的方法非常少使用. 原因是,当编译器无法判断出全部的信息,须要程序猿的帮助时.我们仅 ...
- 关于js中的this之判断this
this绑定规则的优先级顺序 new操作符绑定 > 显示绑定 > 隐式绑定 > 默认绑定 所以在判断函数在某个调用位置应用的是哪条规则,可以按下列这样的顺序 if(函数在ne ...
- SQL语句Where中使用别名作为判断条件
当我们使用某个表达式作为输出的一列时,我们无法再Where条件中直接使用该列作判断条件. 例如下面的SQL语句: select id, (c1 + c2) as s from t1 where ...
- js面向对象编程:if中可以使用那些作为判断条件呢?
作者来源http://www.2cto.com/kf/201407/314978.html搬运 在所有编程语言中if是最长用的判断之一,但在js中到底哪些东西可以在if中式作为判断表达式呢? 例如如何 ...
随机推荐
- Orchard运用 - 设置网站Favicon标识
Favicon其实是访问其网站时在浏览器地址栏最前边呈现的类似logo的图标,可以作为品牌的标识,一般是其网站logo的缩小版并一般是ico格式的图片.详细解释可看这里: Favicon - 维基百科 ...
- c++学习之多态(虚函数和纯虚函数)
c++是面向对象语言,面向对象有个重要特点,就是继承和多态.继承之前学过了,就是一种重用类的设计方式.原有的类叫父类,或者基类,继承父类的类叫子类.在设计模式中,我们总是要避免继承,推荐用组合.因为继 ...
- 跨平台app开发(引擎)工具的选择
1.html5执行速度慢,用户体验不好 2.原生应用开发,即ios和安卓分别开发,需要两种技术人员,后期代码维护困难,很难达到统一. 3.xamarin是一款c#的解决方案,收费.xamarin.fo ...
- 关于从SVN检出项目后,项目名称还是之前修改之前或者项目名称不对问题
找到工作空间Workspaces/项目名称/.projet 修改文件中<name>项目名称</name>属性即可
- Vc++内存布局
Vc++内存布局 测试平台 Windows server 2012 R2 and visual studio 2013 professional. 本篇文章意在介绍vc++中类的内存布局方式,只是研究 ...
- docker桥接
Ifconfig docker0 down Brctl delvr docker0 进入到网卡配置文件 修改eth0网卡参数 加入BIRDGE=br0 创建一个br0 其中ip为真实机的ip 更改do ...
- it-tidalwave-semantic-aux-1.0.13.jar下载
今天来给大家分一下一下自己认为还是挺不错的jar包下载网址,it-tidalwave-semantic-aux-1.0.13.jar,作为java开发人员可能时时刻刻都在跟jar包打交道,即使这会用不 ...
- linux之进程管理详解
|-进程管理 进程常用命令 |- w查看当前系统信息 |- ps进程查看命令 |- kill终止进程 |- 一个存放内存中的特殊目 ...
- spring各种邮件发送
参考地址一 参考地址二 参考地址三 参考地址四 Spring邮件抽象层的主要包为org.springframework.mail.它包括了发送电子邮件的主要接口MailSender,和值对象Simpl ...
- 【laravel54】创建控制器、模型
1.创建控制器(可以带上下一级目录)=>(需要带Controller后缀) > php artisan make:controller self/StudentController; 2. ...