2016-11-22 19 views
1

私はFirebaseデータベースの経費カテゴリの下にある各日付のすべてのオブジェクトを使用します。 FirebaseでAngularfire2 - 親オブジェクトのキーを参照せずにオブジェクト内のすべての値を取得していますか?

:私の見解では

- 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 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.

明らかにそれはオブジェクトではなく、配列として私に日付を与えます。

JSONの値を取得しようとしましたが、* ngFor(パイプ非同期)を使用してJSONオブジェクトを反復処理すると、私には多大な問題が生じます。

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

私はfirebaseリストオブジェクト "food"を反復しようとしています。

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

OR

this.food_json = getAsJSON(this.food); 

私が読んで、束を試してみましたが、私は右の解決策を見つけるように見えることはできませんしました。あなたのために

+0

秒あなたはそのためのパイプを使用して、オブジェクトを配列に変換する必要がありますngFor。良い答えはここにあります:http://stackoverflow.com/questions/35647365/how-to-display-json-object-using-ngfor/35647396#35647396 – Yevgen

+0

ありがとうございました@ Yevgenはそれを調べます。 –

答えて

0
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

+0

jsonパイプを追加すると、{"key":{"variable": "value"}}のようにオブジェクトが文字列として出力されます。私の質問は、日付を指定せずに、カテゴリ内の日付のオブジェクトの各値にアクセスする方法です。完全なオブジェクトをHTMLのかなりの文字列として印刷する方法ではありません。 –

+0

なぜ日付を指定したくないのですか? – ksav

+0

それは質問とは関係ありません。それはあなたがjsonパイプで達成するものではありません。 –

関連する問題