首页 > 解决方案 > 如何通过Angular中数组中的不同对象迭代*ngFor?

问题描述

我从 API(服务器)动态生成了不一致的对象数组。

例如:

array = [
 {name: 'blah', age:2},
 {status: 'pending', date: '20-20-2020'},
 {blah: 'foo', google: 'bar'},
 {apple: 'android', microsoft: 'eeewww'}
]

这个数组可以是任何具有不同键和值的东西。

我如何遍历它以显示其中的值ngFor

我目前正在做的事情:

this.printArray = JSON.stringify(JSON.parse(this.array), null, 4);

<div *ngFor="let print of printArray">
  {{print}}  // it prints the array like {"name": blah, "age": 2} but i don't want it in this way
</div>

标签: javascriptangularngfor

解决方案


您可以使用Angular 键值管道

<div *ngFor="let element of myArray"> 
    <!--element is an object-->
    <div *ngFor="let item of element|keyvalue">
        {{item.key}}:{{item.value}}
    </div>
</div>

推荐阅读