Angularfire: FirebaseListObservable: Get single entries out of the result

Created on 1 Jul 2016  路  8Comments  路  Source: angular/angularfire

I'm using the FirebaseListObservable and this.item = af.database.list('/items'); in order to get a couple of database entries.

But now I need to pick specific items out of this results. I scribbled what I thought about:

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

@Component({
  selector: 'app',
  templateUrl: `
  <ul>
    <li *ngFor="let item in items | async">
      {{ item.name }}
    </li>
  </ul>
  `,
})
class AppComponent {
  items: Observable<any>;
  constructor(af: AngularFire) {
    this.items = af.database.list('/items');
  }

  getItem( uid: string ) {
    // TODO: How to access a single entry like this
    return this.items.uid;
  }
}

I don't want to use the FirebaseObjectObservable because of the fact I need a multiple items and using the FirebaseListObservable is generally fine and I can reduce the amount of requests a lot.

Any idea about this? Thanks in advance! 馃挱

Most helpful comment

@flowdee To get a single entry you really want an FirebaseObjectObservable

const uid = 3;
this.item = af.database.object('/items/${uid}');

And if you already have the data loaded in memory, the SDK won't do a network call unless the item has changed remotely.

If you want to query for these items you can use the query methods

this.itemsUid3 = af.database.list('items', {
  query: {
     equalTo: '3'
   }
});

All 8 comments

try filter method

this.items = this.af.database.list ('items');
.map(items => {
const filtered = items.filter(item => item.uid=== 'gdfdf');
return filtered;
may be this will help >. for filtering the data

Thanks for your reply @Nishanth3 but can you define your example? Not only it's totally broken syntax, but rather a little bit out of context for me. Thanks

Any links to the filtering?

@flowdee To get a single entry you really want an FirebaseObjectObservable

const uid = 3;
this.item = af.database.object('/items/${uid}');

And if you already have the data loaded in memory, the SDK won't do a network call unless the item has changed remotely.

If you want to query for these items you can use the query methods

this.itemsUid3 = af.database.list('items', {
  query: {
     equalTo: '3'
   }
});

Thanks for your reply @davideast I'll check it out.

Just to clarify: e.g. fetching user 4 from database via FirebaseObjectObservable, and later user 5, 6 etc. the SDK doesn't execute a network call for every single FirebaseObjectObservable? Thought it would and just wanted to reduce the amount of calls.

Hi, I'm trying to use the query by calling for an item in the database each time I want a new user when the user click on their name.

But it's just really slow so was looking for a filter option, which isn't here. I do not know how to grab a user by the uid I only have the id.

So why is this so slow for me?

return this.af.database.list('items',{ query: { orderByChild: 'id', equalTo: id } });

and how do I grab an item like this knowing only the id and name values, not using query as for some reason it's too slow (thought it would be cached from what is said above?)

this.item = af.database.object('/items/${uid}');

@mangopop please create your own issue. This one is resolved and for a separate topic. Be sure to follow the issue template.

Hey @davideast following the example you wrote, can you tell me how to make the query work for a typeahead/autocomplete using FirebaseListObservable?

I was trying something like this:
`
this.search = (text$: Observable) =>
text$
.debounceTime(200)
.map(term => term === '' ? []
: this.itemsIntra.filter(v => new RegExp(term, 'gi').test(v.dropname)));

this.formatter = (x: {dropname: string}) => x.dropname;
`

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jnupeter picture jnupeter  路  3Comments

martinyoussef picture martinyoussef  路  3Comments

adriandurran picture adriandurran  路  3Comments

sharomet picture sharomet  路  3Comments

Leanvitale picture Leanvitale  路  3Comments