Angularfire2 - 检索对象中的所有值而不引用父对象的键？

Question

我希望 Firebase 数据库中费用类别下每个日期下的每个对象。

在 Firebase 中：

- expenses
      - food
          - 07-11-2016 //"I want every object in here"
              + -KX7Aju4_G6i6pcNoBzj

在我看来我已经尝试过：

       <div *ngFor="let date of food | async">

          <ion-item-divider sticky>
            {{date.$key}}
          </ion-item-divider>

          <div *ngFor="let item of date"> //This don't seem to work
            <ion-item>
              <h3>{{item.title}}</h3>
              <p>
                {{item.amount}} Kr &mdash;
                kl. {{item.time}}
              </p>
            </ion-item>
          </div>

        </div>

FIREBASE 警告：用户回调引发了异常。错误：找不到“object”类型的不同支持对象“[object Object]”。 NgFor 只支持绑定到 Arrays 等 Iterables。

很明显，它给我的日期是一个对象，而不是一个数组。

我也尝试过检索 JSON 中的值，但使用 *ngFor 迭代 JSON 对象（不使用管道异步）也会给我带来很多问题。

  /* Returns a Firebase list object as a JSON object */
  getAsJSON(firebaseList: any){
    firebaseList
      .map(obj => obj.map(obj => {
        return obj;
      }));
  }

我正在尝试迭代 firebase 列表对象“食物”。

this.food = af.database.list('/expenses/food');

或

this.food_json = getAsJSON(this.food);

我已经阅读并尝试了很多，但我似乎无法找到正确的解决方案。

Answer 1

import {Component} from '@angular/core';
import {AngularFire, FirebaseListObservable} from 'angularfire2';

@Component({
  selector: 'app-root',
  template: `
  <ul>
    <li *ngFor="let item of items | async">
       {{ item | json }}
    </li>
  </ul>
  `,
})
export class AppComponent {
  items: FirebaseListObservable<any>;
  constructor(af: AngularFire) {
    this.items = af.database.list('/items');
  }
}

retrieving-data-as-lists