数据展示--2层循环

ts：

header = [{
       'key': 'name',
       'value': '姓名',
   },
    {
        'key': 'age',
        'value': '年龄',
    }]

 data = [{
      'name': '李',
       'age': 15,
        },
    {
        'name': '王',
        'age': 45,
    }]

data2 = [{
    'name': '李储岩',
    'age': 15,
}]

html：

<label *ngFor="let heder of header">
    <li  style="list-style-type: none">
        {{heder.value}}:
    </li>
</label> // 输出列名

效果图：

<label *ngFor="let da of data">
    <label *ngFor="let heder of header">
        <label style="list-style-type: none">
            {{da[heder.key]}}
        </label>
    </label>
</label>  // 输出列名对应的数据

效果图：

<label *ngFor="let da of data2">
    <label *ngFor="let heder of header">
        <li  style="list-style-type: none">
            {{heder.value}}:{{da[heder.key]}}
        </li>
    </label>
</label>   // 输出列名和对应的数据

效果图