ng-class中的if else判断
来源:互联网 发布:编程常用的算法 编辑:程序博客网 时间:2024/05/20 14:28
来自于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'; };这样的好处是能保证html代码的干净,不会在html中嵌入逻辑。
1 0
- ng-class中的if else判断
- shell 中的条件判断(if else)
- Repeater中的条件判断,以及嵌套判断if...else...
- Repeater中的条件判断,以及嵌套判断if...else... .
- if /else判断语句
- Smarty if else /if 判断
- Smarty if else /if 判断
- iBatis中的sqlmap里if else逻辑判断的写法
- sql中的判断语句 if...else的使用
- Flex中的if...else if...else语句
- if...else中的问题
- EL 中的 else if
- jstl中的if else
- JSX 中的 If-Else
- JSX 中的 If-Else
- Java中的if-else
- Python中的if-else
- JAVA 闰年判断 if - else
- ListView 与Adapter之间的关系
- 100. Same Tree LeetCode
- 270: Closest Binary Search Tree Value
- Android目录结构 及作用——摘自第一行代码
- 242. Valid Anagram LeetCode
- ng-class中的if else判断
- 图片缓存
- DevExpress 从一个XtraGridControl 拖拽行到另外一个
- windows中安装python
- 171. Excel Sheet Column Number LeetCode
- class 和id的区别和联系
- 三者最大实例分析
- 217. Contains Duplicate LeetCode
- copy(浅拷贝-指针拷贝)和mutableCopy(深拷贝-内容拷贝)