angularJS 中html 标签绑定样式,ng-class的使用

样式代码：

.default{    color:black;}.style1{    display:block;    background-color:red;}.style2{    font-size:22px;}

我们可以像一般的HTML那样，直接给定类class，绑定样式

<div>    <span class="default">{{name}}</span></div>

判定启用那个样式true/false,使用angular指令ng-class:

<div>    <span ng-class="{true:'default',false:'style1'}        [name=='angular']">{{name}}    </span></div>

判断name==’angular’，为true选用default样式，false 用style 1样式，相当于if{…}else{..}

判断跟在属性后，与其他的无关，只在乎他自己的value值是true/false:

<div>        <span ng-class="{'default':name=='angular',            'style1':name=='hello',            'style2':name!='angular'&&name!='hello'}">            {{name}}    </span></div>

name值的不同应用的样式不同，应用样式也可叠加。相当于while(){…}的效果，