firestore query wait for nested foreach loop

Question

I'm trying to populate an array with names from all documents in a collection, and also populate another array with all the subcollection documents from those parent documents.

  let data = []
  let names = []
  
  const suppliers = await db.collection('suppliers').get()
  
  suppliers.forEach(async supplier => {

    names.push({name: supplier.data().name, id: supplier.id })

    const deliveries = await db.collection('suppliers').doc(supplier.id).collection('deliveries').get()
    
    deliveries.forEach(delivery => {
      
      data.push(delivery.data())
    })
  })

  console.log(names) // Populated
  console.log(data) // Empty

The problem is that it doesn't wait for the inner loop to finish before executing the code outside. The names array gets populated but the the data array is empty. How can i make the nested loop finish before executing the outside code?

try to use for/while loop. it will solve your problem

Najmul Hosain
– Najmul Hosain

2022-02-25 12:23:40 +00:00
Commented Feb 25, 2022 at 12:23 — Najmul Hosain
– Najmul Hosain, Commented Feb 25, 2022 at 12:23
@NajmulHosain You mean replace foreach with a for loop?

georgesamper
– georgesamper

2022-02-25 13:18:59 +00:00
Commented Feb 25, 2022 at 13:18 — georgesamper
– georgesamper, Commented Feb 25, 2022 at 13:18
yep, that does work with await

Najmul Hosain
– Najmul Hosain

2022-03-03 12:12:01 +00:00
Commented Mar 3, 2022 at 12:12 — Najmul Hosain
– Najmul Hosain, Commented Mar 3, 2022 at 12:12

Frank van Puffelen · Accepted Answer · 2022-02-25 15:30:36Z

1

Loading the deliveries for a supplier is an asynchronous operation. Since you're loading the deliveries for all suppliers and only want to log once all of them are loaded, you need to wait for multiple asynchronous operations, which requires the use of Promise.all:

let data = []
let names = []

const suppliers = await db.collection('suppliers').get()

const promises = suppliers.docs.map(supplier => {

  names.push({name: supplier.data().name, id: supplier.id })

  return db.collection('suppliers').doc(supplier.id).collection('deliveries').get()    
})

const allDeliveries = await Promise.all(promises)
allDeliveries.forEach((deliveries) => {
  deliveries.forEach(delivery => {      
    data.push(delivery.data())
  })
})

console.log(names)
console.log(data)

answered Feb 25, 2022 at 15:30

Frank van Puffelen

603k85 gold badges896 silver badges869 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Shivam Mishra · Accepted Answer · 2022-02-25 15:12:57Z

0

Foreach doesn't support asynchronous callback. In order to get rid of this you can use.

let data = [];
let names = [];
suppliers.then(async(supplier) => {
    names.push({name: supplier.data().name, id: supplier.id })
    const deliveries = await db.collection('suppliers')                                            
                               .doc(supplier.id)
                               .collection('deliveries')
                               .get()
    
    deliveries.forEach(delivery => {
      data.push(delivery.data())
    })
  })

edited Feb 25, 2022 at 15:12

answered Feb 25, 2022 at 12:20

Shivam Mishra

1115 bronze badges

2 Comments

georgesamper Over a year ago

Unfortunately this doesn't work. Same result.

Shivam Mishra Over a year ago

Can you try the edited code now. I think async callback doesn't even work with map.

Collectives™ on Stack Overflow

firestore query wait for nested foreach loop

2 Answers 2

Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related