关于javascript:angular6中使用ngFor遍历数组对象并且利用管道pipe显示对象的键值对

//例：public list: any = [    {      customer: '张三',      card_id: '1306****2022',      address: '北京朝阳区',    },    {      customer: '李四',      card_id: '1306****2088',      address: '北京海淀区',    },];currentCustomerName = '张三';

管道获取对象的key value

import { Pipe, PipeTransform } from '@angular/core';@Pipe({  name: 'getKey',})export class GetKeyPipe implements PipeTransform {  transform(value: any, args?: any): any {    return Object.keys(value).map((key) => Object.assign({ key }, value[key]));  }}

html代码

<div class="list"> <div class="item" *ngFor="let item of list>   <div *ngIf="item.customer === currentCustomerName">     <div class="item-container"           *ngFor="let _item of item | getKey>       <div class="title">{{ _item.key }}</div>       <div class="content">{{item[_item.key]}</div>     </div>   </div> </div></div>

ui成果