Angularfire2 - Abrufen aller Werte in einem Objekt ohne Verweis auf den Schlüssel des übergeordneten Objekts?

Question

Ich möchte jedes Objekt unter jedem Datum in einer Kostenkategorie in der Firebase-Datenbank.

In Firebase:

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

Aus meiner Sicht habe ich versucht:

 <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 WARNING: Exception was thrown by user callback. Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

Natürlich ist es mir das Datum als ein Objekt gibt, kein Array.

Ich habe auch versucht, die Werte in JSON abzurufen, aber die Iteration des JSON-Objekts mit * ngFor (ohne die Pipe Async) gibt mir auch eine Reihe von Problemen.

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

Ich versuche, das Firebase-Liste-Objekt "Essen" zu iterieren.

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

ODER

this.food_json = getAsJSON(this.food); 

Ich habe gelesen und versucht, ein paar, aber ich kann nicht scheinen, um die richtige Lösung zu finden.

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