如何在Angular6中迭代键和值

Question

如何在角度6中拥有这样的东西

<table>
  <tr ng-repeat="(key, value) in data">
    <td> {{key}} </td> <td> {{ value }} </td>
  </tr>
</table>

Answer 1

使用*ngFor进行迭代，就像这样-

<div *ngFor="let item of data | keyvalue">
    Key: <b>{{item.key}}</b> and Value: <b>{{item.value}}</b>
</div>

在Angular 6中，您有keyvalue管道来访问对象的键值。

data = {
    'key1': [{'key11':'value11'}, {'key12':'value12'}],
    'key2': [{'key21':'value21'}, {'key22':'value22'}],
  }

Working Example