javascript - memanggil then hanya setelah metode yang mengembalikan promise selesai


submitTCtoDB() {
  console.log("this.selectedFileList is:  " + this.selectedFileList)
  this.readFile().then(() => {
    alert("ReadFile Finished now submit TC");
    this.submitTC()
  });
}

readFile() {
  return new Promise((resolve, reject) => {
    for (let i = 0; i < this.selectedFileList.length; i++) {
      let file = this.selectedFileList[i];
      alert("file in redafile" + file.name)
      let fileReader = new FileReader();
      fileReader.onload = () => {
        this.fileContent = fileReader.result;
        if (this.fileContent.indexOf("END DATA | BEGIN RESULTS") != -1) {
          alert("Multiple testcases found in " + file.name + " file.  Please separate/save testcases in Calc Builder. Then reimport");
          const index: number = this.selectedFileList.indexOf(file);

          if (index > -1) {
            this.selectedFileList.splice(index, 1);
          }

          console.log(this.fileContent);

        }
        resolve(this.fileContent);
      }
      fileReader.readAsText(file);
    }
  });
}

Saya ingin menjalankan metode submitTC() hanya setelah metode readFile selesai sepenuhnya tetapi .then(di dalam submitTCtoDB) dipanggil terlalu cepat.

Saya pikir .then atau promise tidak digunakan dengan benar.

Fungsi yang diinginkan adalah memanggil metode submitTC hanya ketika metode readFile telah selesai membaca/memisahkan file. Mohon bantuannya.

Jawaban #1

Anda memiliki pemanggilan resolve di dalam loop, tetapi resolve hanya berpengaruh ketika dipanggil untuk pertama kali: begitu sebuah promise terpenuhi, itu adalah keadaan akhirnya, dan callback then akan dijalankan. Jadi itu terjadi ketika file pertama telah dibaca, tanpa menunggu file lain diproses.

Yang bisa Anda lakukan:

  • Ubah FileReader menjadi berbasis janji tanpa menambahkan logika spesifik (pemeriksaan if Anda): biarkan itu di luar, sehingga tetap umum
  • Gunakan Promise.all untuk memetakan daftar file ke janji baru yang akan memberikan daftar konten file.
  • Proses daftar isi untuk pemeriksaan tertentu
  • Kembalikan janji baru (Promise.all atau yang terhubung padanya) kepada pemanggil.

Kode :

submitTCtoDB() {
    console.log("this.selectedFileList is:  " + JSON.stringify(this.selectedFileList))
    this.readFileList(this.selectedFileList).then((validList) => {
        alert("ReadFile Finished now submit TC");
        this.selectedFileList = validList;
        this.submitTC()
    });
}

readFileList(list) {
    return Promise.all(list.map(file => this.readFile(file))).then(contents => {
        return list.filter((file, i) => {
            const fileContent = contents[i];
            if (fileContent.indexOf("END DATA | BEGIN RESULTS") != -1) {
                console.log("Multiple testcases found in " + file.name + " file.  Please separate/save testcases in Calc Builder. Then reimport");
                console.log(fileContent);
                return false; // exclude this file
            }
            return true; // include this file
        });
    });
}

readFile(file) {
    return new Promise(resolve => {
        console.log("file in promiseFile: " + file.name);
        const fileReader = new FileReader();
        fileReader.onload = () => resolve(fileReader.result);
        fileReader.readAsText(file);
    });
}