ng-class用法

ng-class指令有3中操作方式

方式1: 当它的值为一个字符串时,它就会把用空格分开的字符串加到class中(不推荐,与常用class并无太大差别)


....

方式2: 当值为一个数组时,它每个字符串元素都会被加到class中

Using Array Syntax









解释:当我们在样式中定义好bold,strike,red;类的样式后,我们输入这些字符串就会出现效果

方式3: 当值为一个对象时(key=>value),把value为true的key加到class中

这种用法就是说variable为true时,就给元素加上red这个class,如果variable为false就加上green这个class,这个在逻辑比较简单的时候还是蛮好用的。

下一种适合需要添加多个类的时候,也就是ng-class的值为一个对象

Map Syntax Example


deleted (apply "strike" class)


important (apply "bold" class)


error (apply "red" class)
解释:上面代码ng-class就是一个对象,我们把deleted,important,error进行双向数据绑定,当我们在checkbox勾选时,它们变为true,然后对应的key就被加到class中


当 isSelected = true 则增加selected class,当isCar=true,则增加car class,

你可能感兴趣的:(ng-class用法)