时间戳

首页 > 解决方案 > Angular - 为每个表格单元格生成唯一的 css id

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

问题描述

我正在做一个项目，我需要为每个表格单元格设置一个唯一的 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>

我正在尝试id使用上述方法生成 css，其中我将索引变量增加 1。尽管此方法为每一行生成一个唯一的 id，但此技巧不起作用并且所有内容都td相同。id

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

谢谢！

标签： javascriptangular

解决方案

尝试如下

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。

推荐阅读