我有这个json：
[{
"nodename": "Main application Server","enabled": true
},{
"nodename": "Main Server","enabled": false
}]
并使用ngFor在我的模板中显示此数据：
<div class="row" *ngFor="let list of lists">
<div class="col-md-12 col-xs-12">
<div class="panel panel-primary">
<div class="panel-heading">
<h2 class="panel-title text-center">Server: {{ list.nodename }},{{ list.enabled }}</h2>
</div>
</div>
</div>
<div>
现在,我将在我的面板 – 主要模板中设置不同的颜色：如果“启用”：true,则设置绿色,如果“启用”：false,则设置红色.这是怎么回事？用ngIf = …？或者是其他东西？
您可以利用ngStyle指令：
原文链接：https://www.f2er.com/angularjs/141471.html<div class="panel panel-primary"
[ngStyle]="{'background-color': list.enabled? 'green' : 'red'}">
或ngClass：
<div class="panel panel-primary"
[ngClass]="{greenClass: list.enabled,redClass: !list.enabled}">
在组件中使用以下样式：
@Component({
(...)
styles: [
`
.greenClass { background-color: green }
.redClass { background-color: red }
`
]
})
