javascript - Angular - 为每个表格单元格生成唯一的 css id

Question

我正在开发一个项目，我需要为每个表格单元格提供一个唯一的 CSS id。表格的格式是这样的。

<tr *ngFor="let classroom of schoolReportData ; let i = index">
  <td id="{{ 'pieChartDiv'+(i+1) }}"></td>
  <td id="{{ 'pieChartDiv'+(i+1) }}"></td>
  <td id="{{ 'pieChartDiv'+(i+1) }}"></td>
  <td id="{{ 'pieChartDiv'+(i+1) }}"></td>
</tr>           

我正在尝试使用上述方法生成 css id，其中我将索引变量递增 1。这个技巧不起作用，所有 td 都得到相同的结果id，尽管此方法为每一行生成唯一的 id。

我真的很感谢任何帮助。我做了很多技巧，但没有什么对我真正有用:(

谢谢!

Answer 1

尝试如下

let arr = [1,2,3,4];


<tr *ngFor="let classroom of schoolReportData ; let i = index">
  <td *ngFor="let a of arr;" id="{{ 'pieChartDiv'+a }}"></td>
</tr>           

因为如果您输入 id="{{ 'pieChartDiv'+(i+1) }}" 那么它应该为所有 td 元素生成相同的 id。