Angular组件的条件样式

Question

我正在尝试以下列方式根据条件设置组件的样式。

<div class="col-md-3 d-flex justify-content-center align-items-center" ng-style ="{ ' background-color' : (vars.state=='Signup')? '#73c7af' : '#ffffff' }">

和我的vars.state =注册。所以根据这个div的背景应该是＃73c7af但它仍然是白色的。谁能告诉我哪里出错了？

Answer 1

ng-style是AngularJS的语法。对于Angular 2+，请使用[ngStyle]=""语法。

<div class="col-md-3 d-flex justify-content-center align-items-center" [ngStyle]="{ 'background-color' : (vars.state=='Signup')? '#73c7af' : '#ffffff' }">

Answer 2

您可以使用style.propertyName设置任何条件样式属性。

<div class="col-md-3 d-flex justify-content-center align-items-center" [style.background]="someFunction()">