html - Angular 4 - 如何在 ngFor 循环中为标签设置唯一的 id 值？

Question

我遇到了一个问题，我需要为 Angular 4 中的 *ngFor 循环中的每个数据行设置一个唯一的 id 值。

我的代码是这样的:

<div *ngFor="let row of myDataList">
  <div id="thisNeedsToBeUnique">{{ row.myValue }}</div>
</div>

Answer 1

假设您的对象中有一个唯一的 id 值，那么您可以这样做:

<div *ngFor="let row of myDataList">
  <div [attr.id]="row.myId">{{ row.myValue }}</div>
</div>

你也可以这样做:

<div *ngFor="let row of myDataList">
  <div attr.id="{{row.myId}}">{{ row.myValue }}</div>
</div>

您还可以像这样将字符串和动态值连接在一起:

<div *ngFor="let row of myDataList">
  <div [attr.id]="'myString' + row.myId">{{ row.myValue }}</div>
</div>
<!-- Or -->
<div *ngFor="let row of myDataList">
  <div attr.id="myString{{row.myId}}">{{ row.myValue }}</div>
</div>