AngularJS: ng-repeat and ng-class

Question

我对ng repeat和ng class有问题。只有当参数"sel"为true时，我才希望应用类。我的数据是这样的：people = [{"id":0,"name":"Simone","sel":true},{"id":1,"name":"Maria","sel":false},{"id":2,"name":"Marco","sel":false}]

在我的html页面中，我有：

<li ng-repeat="person in people" id="person-{{person.id}}">
        <span ng-class="{person-select: person.sel == 'true'}">{{person.name}}</span>
</li>

但它不起作用。。我哪里错了？我试着用{{person.name}}-{{person.sel}}，上面写着"西蒙对…玛丽亚错…马可错"。

Answer 1

代码的第一个问题是比较boolean值和string值。

true == 'true' // will return false

第二个问题是类的名称没有封装在'中。

Bellow代码修复了这两个问题：

<li ng-repeat="person in people" id="person-{{person.id}}">
    <span ng-class="{'person-select': person.sel}">{{person.name}}</span>
</li>

Answer 2

用'包装类名。

<li ng-repeat="person in people" id="person-{{person.id}}">
        <span ng-class="{'person-select': person.sel == 'true'}">{{person.name}}</span>
</li>

Answer 3

我知道这是一个老问题，但补充一下。我必须从person（从列表中）应用CSS，还需要有条件地添加一个类。以下是它的语法。

<li ng-repeat="person in people" id="person-{{person.id}}">
    <span ng-class="[person.someClass, {'person-select': person.sel}]">{{person.name}}</span>
</li>

这里person.someClass是来自列表的类，而'person-select'是条件类。