NgFor 中的 NgStyles in Angular 4

Question

我想根据某些条件更改字体颜色 ==> 这两个数据都是通过 Http 请求从 observable 返回的，我尝试了下面的这些代码 (Typescript+Angular)

<td *ngFor="let user of userService.users | async">{{user.data.apps.details[0].label}}
          <span [style.color]="user?.data.apps.details[0].state_id as colorId 'green' : 'orange' : 'red'">

</td>

"user" 是我的 Observable，"userService" 我的 http 服务，大括号 {{}} 内的数据是从 Json 对象

中获取的

Answer 1

这不是一个有效的表达式

user?.data.apps.details[0].state_id as colorId 'green' : 'orange' : 'red'

更新

如果 .state_id returns 0、1 或 2:

，这应该是您想要的

<span [style.color]="['green', 'orange', 'red'][user?.data.apps.details[0].state_id]">

NgFor 中的 NgStyles in Angular 4

NgStyles inside NgFor in Angular 4

typescript

ecmascript-6

angular2-directives

rxjs5

angular