我想创建一个HTML表并显示每个国家/地区(PAYS_LIB)
的数据.
我想要得到这样的结果:
<th>COUNTRY:</th>
BELGIUM
<th>LABEL:</th> | <th>ISINCODE: </th>
AB INBEV | NO0010571698
FRENCH
<th>LABEL:</th> | <th>ISINCODE: </th>
WWI | AO0010571614
目前,我有这样的 idea :
<th>COUNTRY:</th>
BELGIUM
FRENCH
<th>LABEL:</th> | <th>ISINCODE: </th>
AB INBEV | NO0010571698
<th>LABEL:</th> | <th>ISINCODE: </th>
WWI | AO0010571614
我不熟悉嵌套循环...
以下是JSON的一个概念
REGROUPEMENT = [
{
TYPEVALUE: 11,
ASSETCATLABEL: 'Actions individuelles',
CURRENCY: 'EUR',
AMOUNT: 1646956.5,
PERCENTAGE: 79.22,
ELEMENT: [
{
LABEL: 'AB INBEV',
PAYS_LIB: 'BELGIUM',
ISINCODE: 'NO0010571698',
},
{
LABEL: 'WWI',
PAYS_LIB: 'FRENCH',
ISINCODE: 'AO0010571614',
},
],
},
];
和我的代码
<div class="container text-center ">
<h2 class="pt-3 pb-3">HTML Table</h2>
<table *ngFor="let item of REGROUPEMENT">
<tr>
<th>TYPE</th>
<th>PRICE</th>
</tr>
<tr >
<td>{{ item.ASSETCATLABEL }}</td>
<td>{{ item.AMOUNT }}</td>
</tr>
<tr>
<th colspan="3">COUNTRY</th>
</tr>
<tr *ngFor="let elem of item.ELEMENT">
<td colspan="3"> {{ elem.PAYS_LIB }} </td>
</tr>
<tr>
<th>LABEL</th>
<th>ISINCODE</th>
</tr>
<tr *ngFor="let elem of item.ELEMENT">
<td> {{ elem.LABEL}}</td>
<td> {{ elem.ISINCODE}}</td>
</tr>
</table>
</div>
我还创建了一个复制品=>;https://stackblitz.com/edit/github-z6v4p8?file=src/app/todo/todo.component.ts