How to use "get" method to retrieve all collection in angularfire2

Question

Firebase cloud store provides "get" method to retrieve the entire collection as following -

    db.collection("users").get().then((querySnapshot) => {
        querySnapshot.forEach((doc) => {
            console.log(doc);
        });
    });

I am using Angularfire2 version 5.0.0rc3 in my ionic 3 project to connect with firebase cloud storage.

I am trying to access this get method as following -

    constructor(
        private afs: AngularFirestore
    ) {
    
        this.afs.collection("users").get().then((querySnapshot) => {
            querySnapshot.forEach((doc) => {
                console.log(doc);
            });
        });
            
    }

But here, "get" method is not working. Can anyone tell me who to use this 'get' method with firebase clould storage and angularfire2.

Confidence

try .ref.get() – Klayman

Awesome! I was looking for it. :) Thank you so much. – Confidence

Answer 1

Actually, it works, just call firestore this.afs.firestore.collection

let userDoc = this.afs.firestore.collection(`users`);
userDoc.get().then((querySnapshot) => { 
   querySnapshot.forEach((doc) => {
        console.log(doc.id, "=>", doc.data());  
   })
})

Chavey

Wish they made this more explicit. Not obvious from the start. – Sha

Answer 2

Not exist get() method in the AngularFirestore collection, use subscribe instead.

Here is an example:

this.afs.collection("users").snapshotChanges().map(actions => {
  return actions.map(a => {
    const data = a.payload.doc.data();
    const id = a.payload.doc.id;
    return { id, ...data };
  });
}).subscribe((querySnapshot) => {
    querySnapshot.forEach((doc) => {
        console.log(doc);
    });
});

I recommend you to read angularfire2 guide first.

Nurserymaid

Thanks, it works. Has there any way not to track the snapshot change event? I have seen it it the angularfire doc, but it seems to me that get() only provides the data of a specific time, and do not listen for any change. That is why looking for get(). Whether 'snapshotChanges' always trigger this of each change. I actually do not want to keep listening any event, Just need the data of that time. – Confidence

Best option is to use first() or take(1). – Nurserymaid

Answer 3

I am also facing same issue. for me the browser hangs when large data is getting retrieved. Moreover valueChanges() listens for new changes and the piece of code starts execution again.

For retrieving large data, its better to write a cloud function. Get the data from the cloud function and then display that under Angular application.

Firebase Cloud Functions

Defile

Answer 4

Angular 8 with new @angularfire package

let query = this.fs.collection('users')

    return query.get()
    .pipe(
        map(snapshot => {
            let items = [];
            snapshot.docs.map(a => {
                const data = a.data();
                const id = a.id;
                items.push({ id, ...data })
            })
            return items
        }),
    )

Toots

Answer 5

What I did when I wanted to retrieve a single document once from Firestore without the need of valueChanges or SnapshotChanges -- Angular Firestore

 this.db.collection<any>('members').doc(id)
.get()
.pipe(first())
.subscribe(res => {
   this.member = res.data()
 })

Designed

Answer 6

My 2 cents are as follows, you could do something like this. In my use case I don't require to watch for value changes regularly, while a nice feature I don't want to be consistently making calls to the DB when data isn't changing frequently. So I've created a data service, which on app "start"/"init" I load the data needed up front (be sure to add some limits - in this case there is already limit on services), like this:

private getServices() {
  let data = [];
  const collection = this.afs.collection<Service>('services', ref => ref.where('isAddOn', '==', false).orderBy('name', 'asc'));
  collection.get().subscribe(snapshot => {
    snapshot.forEach((res) => {
      data.push(res.data());
    });
  });
  return this._services = data;
}

Then I can assign it to a getter and use it where necessary.

Keep in mind this works for my specific use case really well. As data isn't changing that often and I have a separate "refresh" call to manage updating data on the UI where necessary.

Hope this helps, any feedback and thoughts are also welcome.

Poult