样式元素如果满足条件,AngularJS

时间:2015-08-11 15:26:32

标签: css angularjs ng-style

<div ng-if="item.attribute == 'attribute1'">
    doSomething
</div>

<button class="button button-block button-postive waves-effect waves-button waves-light">
    Button 1
</button>

我想这样做,如果item.attribute == attribute1那么按钮的颜色是珊瑚

.button.button-block, .button.button-full {

    background-color: coral;
    color: #fff;
}

这可能吗?谢谢

3 个答案:

答案 0 :(得分:2)

使用ng-class

ng-class="{ 'style': condition, 'style2' : condition2}"

具体做法是:

ng-class="{ 'button-block': item.attribute == 'attribute1'}"

https://docs.angularjs.org/api/ng/directive/ngClass

答案 1 :(得分:0)

您可以使用ng-class来完成此操作。

<button ng-class="{'button-block': item.attribute==attribute1}">

答案 2 :(得分:0)

这是在不声明类的情况下执行此操作的另一种方法。

ng-style="item.attribute == 'attribute1' 
    && {'background-color':'red', 'color':'white'} || {'background-color':'blue', 'color':'white'}"