Bdtjtk

I am getting a zipped file of images and csv files from a user. I need to unzip those files and upload them to Firestore. When I upload the images, I also want to save the path to download the image in an image object which I push later. I want to save the id's of all the image objects that I push and save them in a term object. I want to wait until all my files are uploaded before calling some other functions.

My function though is being called immediately before my termObj is populated. I tried to save promises and wait until all of them resolve but the promise.all is being executed immediately ( it does not wait for promises to get populated in the for loop )

How do I wait for all of my files to be uploaded and have a populated termObj before I call this.printDone()?

async fileChanged(event) {

const file = event.target.files[0];

const self = this;

let promises= ;

let termObj = {

  all_images: ,

};



this.zipService.getEntries(file).subscribe( (next) => {



  for (const ent of next) {

    let filename : string = ent.filename;

    const fileType = filename.slice(filename.indexOf("."));

    this.zipService.getData(ent).data.subscribe(async function(val) {



      let blobFile = new File([val], filename);

      self.task =  self.storage.upload(self.authService.getUser() +  "/" +filename, blobFile);





      if( fileType === '.jpg' || fileType === '.jpeg' || fileType === '.png'){

        let pathToFile = self.authService.getUser() + '/' + filename;

        // URL

        await firebase.storage().ref().child( pathToFile ).getDownloadURL().then(function (url) {

          let imageObj = {

            downloadURL: url,

          };

          const imagePromise = self.db.collection('images').add(imageObj).then(function(ref){

            termObj.all_images.push(ref.id);

            console.log(termObj);

          });

          promises.push(imagePromise);

        });

      }

    }); // end of unzip service that gets data from zipped entry

  } // end of for loop looping through files



}); //gets entries from zipped file

await Promise.all(promises).then(()=>{

    this.printDone();

    console.log(termObj.all_images);

});

} // end of method

=============Edit==========
moving the await Promise.all statement right after the end of the for loop and then console.log the termObj.all_images gives me the same result.

output of console.log(termObj.all_images)

Move this

await Promise.all(promises).then(()=>{

this.printDone();

console.log(termObj.all_images);});

just after closing the for of.

Your problem is caused because the subscribe is asynchronous (you already know that) But that implies that the promises array is empty when this code is reached.