Angularfire: [Question] Retrieve nested data from Firebase using Angularfire2 + Rxjs

Created on 2 Dec 2016  路  5Comments  路  Source: angular/angularfire

I'm sorry for posting a question here. I've been trying to get an answer on Stackoverflow, but couldn't find an answer for this.

I have the following code which returns an observable with the item details for each item key:

this.list = this.af.database.list("API_URL")
      .map((ItemKeys) => {
        return ItemKeys.map((ItemKey) => {
          return this.af.database.object(API_URL + "/" + ItemKey); //I need this as the object (not observable)
        });
      }).subscribe((items) => {
        this.lineData = items; //A list of observables
      });

The code itereates over each item key and gets the item data from another endpoint. The problem is that it retruns an observable of each item data, and I need it in an object (the observable result).

I tried to return the subscription result with the following code, but then all my items data are empty (undefined):

this.list = this.af.database.list("API_URL")
      .map((ItemKeys) => {
        return orderItemKeys.map((ItemKey) => {
          this.af.database.object("API_URL" + "/ItemKey.$key) // So I tried to subscribe to this..
          .subscribe((data) => {
            return data;
          });
        });
      }).subscribe((items) => {
        this.lineData = items; // A list with undefined items
      });

How I can return the item data object as an object and not as observable of an object in my case?

Most helpful comment

Here you are a solution
`` this.yourData = this.af.database.list('API_URL', {query:{orderByKey :true}}) .map((itemKeys) => { return itemKeys.map(key => { key.data = this.af.database.list(API_URL/${key.$key}`);
return key;
})

    })

view:
  • {{ (item.data | async)?.field }}

```

All 5 comments

Here you are a solution
`` this.yourData = this.af.database.list('API_URL', {query:{orderByKey :true}}) .map((itemKeys) => { return itemKeys.map(key => { key.data = this.af.database.list(API_URL/${key.$key}`);
return key;
})

    })

view:
  • {{ (item.data | async)?.field }}

```

@mpeguero you returned the same... an observable. You need to use the |async for the data.

Check out the view. With async pipe you don;t need to subscribe the observable. it makes the subcription for you

@mpeguero need your help please !!

getModel(model){

let modelQuery = this.afo.database.list(this.currentUser.username + '/models'     , {

  query: {
       orderByChild: 'name',
       equalTo: model

     }}).map((items) => {
       return items.map(item => {
         item.data = this.afo.database.list(this.currentUser.username + `/models/${model.items}` );
         console.log("item",item); 

         return   item;
       })
     })

return modelQuery

}
so its return an observable and item its my array how i can retrieve item to a new variable item ?

I don't understand clearly what you trying to achieve. To access item from the observable Just subscribe to it.
modelQuery .subscribe((items)=>{
var _items = items
})

Or maybe your issue is on the view, soy you have nested data.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

DennisSmolek picture DennisSmolek  路  3Comments

KLiFF2606 picture KLiFF2606  路  3Comments

Leanvitale picture Leanvitale  路  3Comments

Sun3 picture Sun3  路  3Comments

StephenFluin picture StephenFluin  路  3Comments