下图显示了我的表格,其中数据是动态设置的。例如,它可以有 2,3,4 ... 列。
我的 html 代码如下:<thead>包含标题值,并tbody包含可以修改的值。
<table class="table-conf">
<thead>
<tr>
<th *ngFor="let data of jsonText[0]" style="text-align: center;">{{data}}</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of jsonText; let i=index">
<ng-container *ngIf="i!=0">
<td class="padding-table" *ngFor="let dt of data; let j=index">
<input style="text-align: center;" [(ngModel)]="jsonText[i][j]">
</td>
</ng-container>
</tr>
</tbody>
</table>
Run Code Online (Sandbox Code Playgroud)
以下是jsonText我迭代的变量示例:
jsonText Array(6)
0: (2) ["Task", "Hours per Day"]
1: (2) ["Work", 11]
2: (2) ["Eat", 2]
3: (2) ["Commute", 2]
4: (2) ["Watch TV", 2]
5: …Run Code Online (Sandbox Code Playgroud)