ng-class是AngularJS预设的一个指令,用于动态自定义dom元素的css class name.
在angular中为我们提供了3种方案处理class:
1:scope变量绑定。
<button ng-class="{{blue}}">button1</button> $sc.blue = "blue"; .blue{ background-color: blue; }
2:字符串数组形式。
<button ng-class="{true: ‘red‘}[isRed]">button2</button> $sc.isRed = true; .red{ background-color: red; }
3:对象key/value处理。
<button ng-class="{‘yellow‘: isYellow, ‘color‘: color}">button3</button> $sc.isYellow = true; $sc.color = true; .yellow{ background-color: yellow; } .color{ color: #ccc; }
效果:
http://runjs.cn/detail/aywqo0hg
时间: 2024-10-09 18:08:42