angular 中的动态 css class

Question

我有以下情况：

json:

[{"id":1,"prio":3},
{"id":2,"prio":3},
{"id":3,"prio":3},
{"id":4,"prio":4},
{"id":5,"prio":2}]

HTML/Angular

<ul ng-repeat>
<li class="high">{{id}}</li>
</ul>

现在我的目标是根据属性 'prio' 自动更改 css class。

When prio = 1 --> css= "low"
when prio = 2 --> css = "medium"

我怎样才能做到这一点？

Answer 1

使用ngClass:

<ul>
  <li ng-repeat="item in arr" ng-class="{low: item.prio === 1, medium: item.prio === 2}">{{id}}</li>
</ul>

dynamic css class in angular