Angular 在一个zip文件夹中使用jsZIP下载多个csv文件

下面是我为csv文件创建数据并在zip文件夹中下载csv文件的代码：

generateCSVfiles()
{
     this.studentdata.forEach(function (student)
{
      this.service.getStudentDetails(student.studentId).subscribe
          (res => {
            var dataSet =  JSON.parse (res);
            // start
            if (student.studentId == "Senior") {
             
               const header = ["studentId","studentName","studentaddress", "studentmarks", "studentgrade"];
              const replacer = (key, values) => values === null ? '' : values // specify how you want to handle null values here
              this.seniordata = dataSet.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','))
              this.seniordata.unshift(header.join(','));
              this.seniordata = this.seniordata.join('\r\n');
            }
            else  (student.studentId == "Junior") {
                const header = ["studentId","studentName","studentaddress", "studentmarks", "studentgrade"];
              const replacer = (key, values) => values === null ? '' : values // specify how you want to handle null values here
              this.juniordata = dataSet.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','))
              this.juniordata.unshift(header.join(','));
              this.juniordata = this.juniordata.join('\r\n');
               
            }
        this.downloadzip();
   }
}.bind(this)
}
   

public downloadzip()
{
    
     let zip = new JSZip();
      // Fill CSV variable
          // i am getting two separate zip file by below logic but need to 
         //implement  logic here to add two different file in one zip folder
      zip.file( 'Studentrecord'+'.csv', this.juniordata);
      zip.file( 'Studentrecord'+'.csv', this.seniordata);
    
    zip.generateAsync({
      type: "base64"
    }).then(function (content) {
      window.location.href = "data:application/zip;base64," + content ;
    });

}

上面的代码工作正常，当我们一次得到一个大三或大四学生的响应数据时，能够在zip文件夹中下载csv文件。但当我们同时收到初级和高级数据时，它会下载不同的zip文件，或者有时只生成一个zip文件。但我希望两个文件都放在一个zip文件夹中。有人能告诉我如何在一个zip文件夹中下载不同的csv文件吗

this.studentdata =[{studentId: "Senior"
StudentName: "Rock"},{studentId: "Junior"
StudentName: "John"}] 

上述变量中提供的此类数据

dataset = [{studentId: "Senior"
StudentName: "Rock",studentaddress:"US",studentmarks:"56",studentgrade:"A"},{studentId: "Junior"
StudentName: "John",studentaddress:"UK",studentmarks:"59",studentgrade:"B"}] 

---

来自json的这类数据提供了不同的文件名，您为这两种记录提供了相同的文件名，并且在zip中不能有多个同名文件。如果您的目标是拥有多个excel工作表，那么这个问题是错误的。在这种情况下，您需要像那样创建excel。

这里您没有正确地表示您的问题。感谢您在stackbliz上创建演示。无论如何，这是由于您的迭代并没有等到每个可观察到的对象都完成之后再继续下一个，并且您已经在评论中告诉我们这是真的

首先，您需要理解rxjs中的可观察承诺的概念。一旦您正确理解了，就要通过一些额外的操作符，如merge、mergeAll、forkjoin等

现在来回答你的问题： 总是用承诺来做类似的事情，下面就是一个例子，但是，我相信也有一种RXJS方法来解决这个问题，所以你可能想探索一下

请按顺序遍历异步

import * as Bluebird from 'bluebird';

async generateCSVfiles() {
    //first iterate through everything in series
    await Bluebird.mapSeries(this.studentdata, (data) => {
        return new Promise((resolve, reject) => {
            this.service.getStudentDetails(student.studentId, student.StudentName).subscribe(res => {
                ...
                
                //once you finish your conditionals
                resolve();
            })
        });
    });


    //then, once complete, run download zip
    this.downloadzip();
}
 

---

在什么情况下，您将同时收到这两种情况的数据？generateCSV方法具有if-else语句。一次只能执行其中一个。对于大三和大四学生的回答是什么？嗨，阿卡什，为了更好地理解，我更新了问题，请您不要集中数据和条件，因为代码在我的系统上运行良好，我为两名学生提供了两个不同的zip，但我希望其中一个zip文件应包含两个csv文件。您可以在stackblitz上添加类似的虚拟演示吗？调试Hey@akash很容易。我也尝试过使用不同的文件名，通过分配不同的变量，我能够下载两个不同的zip文件，而不是一个。因此，这里的问题可能是，迭代不会等到每个可观察对象完成后再继续下一个，因为我们需要实际的代码来说明如何处理可观察对象。