javascript - 在 ionic 2 中等待 foreach 的执行继续下一步

Question

我尝试在执行 for 循环后使用数组列表的值。

我的问题是，当我运行我的应用程序时，它会执行下一个函数，而无需等待我的 for 循环

这是我的 TS 代码，

convertToPDF(){
    let loader = this.loadingCtrl.create({
        content: "Generating..."
    })
    loader.present().then(_=>{
        this.TempNotesImagesList.forEach(n=>{
            this.convertToDataURLviaCanvas(n.url, "image/jpeg").then(base64Img => {
                this.images.push(base64Img);
            });
        })
    }).then(_=>{
        loader.dismiss();
        console.log(this.images); //Check images
        this.createPdfX(); //convert to PDF :D
    });

}

Answer 1

您需要 convertToDataURLviaCanvas 串行还是并行运行？

系列:

convertToPDF() {
    let loader = this.loadingCtrl.create({
        content: "Generating..."
    });
    loader.present()
    .then( _ => this.TempNotesImagesList.reduce((p, n) => p.then(_ => this.convertToDataURLviaCanvas(n.url, "image/jpeg").then(base64Img => {
        this.images.push(base64Img);
    })), Promise.resolve())).then(_ => {
        loader.dismiss();
        console.log(this.images); //Check images
        this.createPdfX(); //convert to PDF :D
    });
}

并行:

convertToPDF() {
    let loader = this.loadingCtrl.create({
        content: "Generating..."
    });
    loader.present()
    .then( _ => Promise.all(this.TempNotesImagesList.map(n => this.convertToDataURLviaCanvas(n.url, "image/jpeg").then(base64Img => this.images.push(base64Img)))))
    .then(_ => {
        loader.dismiss();
        console.log(this.images); //Check images
        this.createPdfX(); //convert to PDF :D
    });
}