data = {
"dateFilters": {},
"search_param": "",
"search_term": "",
"workType": ["Part Time", "Full Time"],
"company.name": ["Company A", "Company B"]
};
我想遍历此对象并检查密钥是否不是dateFilters, search_param, and search_term
,然后循环该密钥并打印其值。
我想要这样的事情:
<span>workType
<a class="btn btn-link btn-xs btn-keyword mrgn-tp-sm">
<span class="wb-inv"></span>Part Time<span class="fa fa-times" aria-hidden="true"></span>
</a>
<a class="btn btn-link btn-xs btn-keyword mrgn-tp-sm">
<span class="wb-inv"></span>Full Time<span class="fa fa-times" aria-hidden="true"></span>
</a>
</span>
<span>company.name
<a class="btn btn-link btn-xs btn-keyword mrgn-tp-sm">
<span class="wb-inv"></span>Company A<span class="fa fa-times" aria-hidden="true"></span>
</a>
<a class="btn btn-link btn-xs btn-keyword mrgn-tp-sm">
<span class="wb-inv"></span>Company B<span class="fa fa-times" aria-hidden="true"></span>
</a>
</span>
我目前的代码是这样的并且有效:
<ng-container *ngIf="data?.workType">
<a *ngFor="let workType of data?.workType" (click)="removeWorkTypeAndSearch()" class="btn btn-link btn-xs btn-keyword mrgn-tp-sm"><span class="wb-inv">Remove keyword </span>{{ workType }}<span class="fa fa-times" aria-hidden="true"></span></a>
</ng-container>
<ng-container *ngIf="data?.functionalArea">
<a *ngFor="let functionalArea of data?.functionalArea" (click)="removeWorkTypeAndSearch()" class="btn btn-link btn-xs btn-keyword mrgn-tp-sm"><span class="wb-inv">Remove keyword </span>{{ functionalArea }}<span class="fa fa-times" aria-hidden="true"></span></a>
</ng-container>
但是我希望有一个动态部分,并且不需要为每个键都有单独的循环,因为data
对象有很多需要这个循环的键。
注意:data
元素是动态的,它们可能存在或不存在,我不应该通过data.key
进行检查,因为它对我来说是未知的,它是动态添加的,它们可能是很多其他元素密钥。