对于单个css属性

ng-style="1==1 && {'color':'red'}"

对于下面的多个css属性可以参考

ng-style="1==1 && {'color':'red','font-style': 'italic'}"

用条件表达式替换1==1

编辑:

好吧，我以前不知道AngularJS通常指的是Angular v1版本，而只指Angular v2+

这个答案只适用于Angular

把这个留在这里，以备将来参考。

不知道它对你们来说是如何工作的，但在Angular 9中，我必须像这样用括号括起ngStyle:

[ng-style]="{ 'width' : (myObject.value == 'ok') ? '100%' : '0%' }"

否则就不行

就像@Yoshi说的，从angular 1.1.5开始你就可以不用做任何改变就可以使用它了。

如果你使用angular < 1.1.5，你可以使用ng-class。

.largeWidth {
    width: 100%;
}

.smallWidth {
    width: 0%;
}

// [...]

ng-class="{largeWidth: myVar == 'ok', smallWidth: myVar != 'ok'}"

对于多个独立的条件，我像下面这样做，它很有魅力:

<div ng-style="{{valueFromJS}} === 'Hello' ? {'color': 'red'} : {'color': ''} && valueFromNG-Repeat === '{{dayOfToday}}' ? {'font-weight': 'bold'} : {'font-weight': 'normal'}"></div>

一般来说，您可以结合使用ng-if和ng-style合并背景图像的条件更改。

<span ng-if="selectedItem==item.id"
              ng-style="{'background-image':'url(../images/'+'{{item.id}}'+'_active.png)','background-size':'52px 57px','padding-top':'70px','background-repeat':'no-repeat','background-position': 'center'}"></span>
        <span ng-if="selectedItem!=item.id"
              ng-style="{'background-image':'url(../images/'+'{{item.id}}'+'_deactivated.png)','background-size':'52px 57px','padding-top':'70px','background-repeat':'no-repeat','background-position': 'center'}"></span>

简单的例子:

<div ng-style="isTrue && {'background-color':'green'} || {'background-color': 'blue'}" style="width:200px;height:100px;border:1px solid gray;"></div>

{'background-color':'green'}返回true

或者是同样的结果:

<div ng-style="isTrue && {'background-color':'green'}" style="width:200px;height:100px;border:1px solid gray;background-color: blue"></div>

其他条件可能性:

<div ng-style="count === 0 && {'background-color':'green'}  || count === 1 && {'background-color':'yellow'}" style="width:200px;height:100px;border:1px solid gray;background-color: blue"></div>