使用* ngFor从对象键获取对象值

Question

我具有以下数据库结构：

对于如何从April和May键获取对象的值，我有些困惑。在使用* ngFor迭代对象时。我将所有键作为对象。我尝试使用keyvalue，但不起作用。

完整代码：

  orderhistory: AngularFireList<any>;
  keyArray: any[]; // to use with *ngFor

  ngOnInit() {

    this.orderhistory = this.af.list("/orderhistory")
    this.orderhistory.snapshotChanges()
    .pipe(
      map(changes =>
        changes.map(c => ({ $key: c.payload.key, ...c.payload.val() }))
      ), tap(val => this.keyArray = []), map(data => {
        data.forEach((row, dataObj) => {
          Object.keys(row).forEach((r, objIndex) => {
            if (r === '$key') {
              this.keyArray.push({ row: row['$key'], 'value': [] });
            } else {
                this.keyArray[dataObj]['value].push({ 'subRowKey': r, 'subRowValue': row[r] })
            }
            return row;
          })
          return row;
        })
        onsole.log(this.keyArray)

        return data;
      })
    ).subscribe((data: any) => {

        console.log(data)
      });
  }

HTML

    <tbody *ngFor="let row of keyArray; let i = index">
        <tr role="row"  *ngFor = "let subRow of row.value |keyvalue; ">
            {{subRow.subRowValue|json}}
        </tr>
    </tbody>

输出

如上所述，我的数据现在位于subRowValue下。那么，如何避免或访问用于在其中获取数据的密钥？可以使用|keyvalue吗？

Answer 1

您很近。使用key管道时，您需要明确指定value和keyvalue。并且根据您的控制台日志，似乎在*ngFor中混合了变量名。请尝试以下

<tbody *ngFor="let value of keyArray.value; let i = index">
  <tr role="row"  *ngFor = "let subRow of value.subRowValue | keyvalue; ">
    {{ subRow.value | json }}
  </tr>
</tbody>