如何使用Angle 2+循环对象键并在表格中显示

Question

我有数据：

plan[PowerSaverIdx]['id']

我正在尝试使用 data = { "laptop": [ "dell", "hp", "lenovo", "acer", "asus" ], "mobile": [ "lenovo", "motorolla", "apple", "samsung" ] } 在表格中显示它，以便以以下格式显示数据

但是我无法从下面获取数据，而只能从笔记本电脑，移动钥匙中获取传统格式的数据 有没有办法在模板中做到这一点

Stackblitz demo

将来是否有其他替代方法或更好的方法，我可能会为该表获取n行

Answer 1

如果您使用的是angular 6.1，则可以使用键值

<div *ngFor="let title of data | keyvalue">
  {{title.key}}
</div>

示例：https://stackblitz.com/edit/keyvalue-pipe

Answer 2

您可以使用此：

get dataKeys() { return Object.keys(this.data); }

这将创建对象键的数组。

您现在可以在其上使用循环：

<div *ngFor="let key of dataKeys">
  <div *ngFor="let item of data[key]">...</div>
</div>