通过循环获取对象的键并获取对象的值？

Question

我在数组中循环并通过循环获取密钥，并且使用该密钥我想从数组中获取对象的值。

<ion-list-header *ngFor="let child of item.value[item.key]; let j = index" no-padding>  
            <h2>
             {{ child['layoutName'] }}
            </h2>

             <h1>{{ result[ child['layoutName']] }}</h1>

      </ion-list-header>

结果对象是：

this.result = [{"light1" : true},{"light2" : true},{"light3" : true}]

child['layoutName']有关键的前任。 light1，light2

Answer 1

使用Object.keys获取对象key

Stackblitz Demo

.ts文件

Object = Object;
result = [{"light1" : true},{"light2" : true},{"light3" : true}];

.html文件

<ion-list-header *ngFor="let child of result; let j = index" no-padding>
    <ng-container *ngFor="let keys of Object.keys(child)">
        <p>Keys - {{keys}}</p>
        <p>value - {{child[keys]}}</p>
    </ng-container>
</ion-list-header>

Answer 2

您可以创建一个过滤管道，它会在给定密钥的情况下为您的阵列返回正确的元素。由于性能原因，过滤管通常是discouraged in angular，但如果你的阵列很小则无所谓。

还有另一种选择：您可以将原始数组转换为对象，以便直接使用它。

this.result = { "light1" : true,"light2" : true,"light3" : true}

那就行了

  <h1>{{ result[ child['layoutName']] }}</h1>