Ionic3 Angularfire listen to firestore changes

Question

how do I listen to event after firebase cloud function had successfully updated a document? Because there is a few seconds lag while the function is running. I want to implement a loading screen and dismiss it when the function successfully updated the record.

example:

1. MyApp update data to firebase ref A
2. firebase function detect changes in ref A and execute update same data to ref B
3. MyApp does not know when will firebase function complete step 2 above, i need to listen to ref B for changes done to dismiss the loading

Answer 1

You can use the update or set method of AngularFire to change the value of a document. those methods return a Promise, when fulfilled you can remove the loader.

updateItem() {
    this.loading = true;
    const item = { id: 1, name: "My Item };
    this.db.doc('item/1').update(item)
                         .then(() => this.loading = false;;
}

For more examples look at the AngularFire documents documentation

Update:

If you need to subscribe to document changes without changing it, simply do:

this.db.doc('item/1').valueChanges()
                     .subscribe((data) => console.log('new data logic');