我需要通過 ngFor 指令 angular 中的索引訪問陣列項的值
假設我有 entityList 陣列。我也有 columnNames 陣列，它為我提供了要生成的 td 數。所以 columnNames 充當表頭， entityList 有資料以表格格式顯示。
entityList{
"Id": 1,
"Name": "Admin",
}
{
"Id": 2,
"Name": "Finance",
}
columnNames{
"Id",
"Name",
}
<table >
<thead>
<tr>
<th *ngFor="let column of columnNames" scope="col">
{{column}}
</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let entity of entityList">
<td *ngFor="let column of columnNames;let i = index">
{{entity[i]}}
</td>
</tr>
</tbody>
</table>
我知道我可以像下面那樣做，但是我想使用索引而不是名稱來列印值。
<tr *ngFor="let entity of entityList;let i = index">
{{entity.Id}}
{{entity.Name}}
</tr>
uj5u.com熱心網友回復：
通過索引訪問條目的屬性是不可能的，因為它不是陣列而是物件。您可以做的是獲得類似行為的是其屬性及其鍵。
ts
keys = Object.keys;
entityList = [
{ id: 1, name: 'Admin' },
{ id: 2, name: 'Finance' }
];
html
<div *ngFor="let entity of entityList;">
<span>
{{ entity[keys(entity)[0]] }} // here you can access the keys index
</span>
</div>
基本上這個想法是獲取陣列中的屬性鍵，選擇第一個/第二個，然后通過這個鍵訪問物件屬性。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/314757.html