遍历Angular 8中的对象键 [英] Iterate through an object key in Angular 8

问题描述

我有这个对象:

 受保护的产品:{[键:字符串]:{颜色:字符串，品牌:串，};} = {};产品= {scan12345:{颜色:橙色"，品牌:"X"}，scan13813:{颜色:粉红色"，品牌:"X"}，} 

如何在组件Tempate中遍历该项目?我试过了:

 < ion-item * ngFor =让产品成为专业人士">{{pro.color}}</ion-item> 

解决方案

您可以使用KeyValuePipe:

 < ion-item * ngFor =产品的专业版|键值">{{pro.value.color}}</ion-item> 

文档: https://angular.io/api/common/KeyValuePipe

I am having this object:

protected products: { 
 [key: string]: {
  color: string,
  brand: string,
 };
} = {};

products =  {
 scan12345: {color: "Orange", brand: "X"},
 scan13813: {color: "Pink", brand: "X"},
}

How can I iterate through this project in my component Tempate? I tried:

<ion-item *ngFor="let pro of products">
   {{ pro.color }}
</ion-item>

解决方案

You can use the KeyValuePipe:

<ion-item *ngFor="let pro of products | keyvalue">
   {{ pro.value.color }}
</ion-item>

Documentation: https://angular.io/api/common/KeyValuePipe

这篇关于遍历Angular 8中的对象键的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！