In my Website, I want to display a List of Items by their Name. The names are clickable and then the entire doc should be downloaded and you can edit and save the item.
Currently I'm querying collection Data from my FireStore with the way described in the docs: https://github.com/angular/angularfire2/blob/master/docs/firestore/collections.md
private itemsCollection: AngularFirestoreCollection<Item>;
items: Observable<Item[]>;
constructor(private afs: AngularFirestore) {
this.itemsCollection = afs.collection<Item>('items');
this.items = this.itemsCollection.valueChanges();
}
The problem is, I do not want or need realtime Updates for my list. So the Observable approach doesn't really make sense for my app.
The only Way I came up with is that I just use the snapshotChanges Method, and map it to an array, which I then assign to a field. Afterwards the mapping function, sets the items and itemsCollection fields to null, so they don't waste any more bandwidth. But that doesn't seem right to me.
Is there a way to just Query a Collection once, preferrably with Query Parameters, in AngularFire and then display it?
One way I have handled this is by using the rxjs/add/operator/first. This method fetches the Observable data once then ends the subscription.
just import that library above and make your calls like so:
this.items = this.itemsCollection.valueChanges().first();
then you could subscribe to that and it will only fetch the data once:
this.items.subscribe((items) => {
// do something with items array //
});
I know there are other methods to handle this using the rxjs do() and take() methods as you may want to look into those. I hope this can be of help!