CODEWITHSUNDEEP
angularfirebaseionic3angularfire2google-cloud-firestore
Tahmina Khatoon
Tahmina Khatoon

Reputation: 1091

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

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.

Upvotes: 6

Views: 14784

Answers (6)

Andrew Spies
Andrew Spies

Reputation: 26

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.

Upvotes: 0

quince
quince

Reputation: 165

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());  
   })
})

Upvotes: 13

dave o grady
dave o grady

Reputation: 822

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()
 })

Upvotes: 1

Ian Samz
Ian Samz

Reputation: 2109

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
        }),
    )

Upvotes: 1

Nikhil
Nikhil

Reputation: 1018

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

Upvotes: 1

coturiv
coturiv

Reputation: 2970

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.

Upvotes: 5

Related Questions