Question

我有一个带复选框的网格，我将检查值放在一个数组（currentFocusedRow）中，现在我想将 activeRow 类分配给选中的行：

// app.ts
class contact {
  public contactlist = [{icontact_id: "contact1"}, {icontact_id: "contact2"}, {icontact_id: "contact3"}, {...}];
  public currentFocusedRow = ["contact2", "contact3"];
}

// app.html
<tr *ngFor="let contact of contactlist"
   [class.activeRow]="contact.icontact_id == currentFocusedRow">
   ...
</tr>

现在因为currentFocusedRow是一个我不能像那样检查的数组（contact.icontact_id == currentFocusedRow），应该有一些东西可以检查该数组中是否存在该值，如 indexOf

Answer 1

我认为这应该适合你：

打字稿

isActive(id) {
    return this.currentFocusedRow.indexOf(id) !== -1
}

HTML

<tr *ngFor="let contact of contactlist"
    [class.activeRow]="isActive(contact.icontact_id)">
</tr>

Answer 2

您可以使用：

来使用当前对象的索引

<tr *ngFor="let contact of contactlist; let i = index">

这将使您能够获得这些索引。

除此之外，你可以使用NgClass指令。

Answer 3

检查指令中的indexOf本身是否有效，我们可以直接在DOM中使用这个JS方法，这真是太神奇了：

<tr *ngFor="let contact of contactlist;"
    [class.activeRow]="currentFocusedRow.indexOf(contact.icontact_id) != '-1'">
</tr>

条件css类以角度2分配

3 个答案: