angular - jspdf在图像加载之前保存文档

Question

我正在尝试将多个大base64图像保存到一个pdf文件中

exportPdfv3p3(imgPath:string, x:number, y:number, width:number, height:number)
{
    var pdfFile = this.pdfItem;
    var localNumImagesLoaded = this.numImagesLoaded + 1;
    var totalNumImages = this.numImages;

    var img = new Image;
    img.src = imgPath;
    var pdfWidth = pdfFile.internal.pageSize.getWidth();

    img.onload = function()
    {
        pdfFile.addImage(img, 'PNG', pdfWidth - width - 5, y, width, height);

        console.log("localNumImagesLoaded",localNumImagesLoaded);
        if (localNumImagesLoaded > totalNumImages)
            alert("numImagesLoaded desync (too many images)");
        else if (localNumImagesLoaded < totalNumImages){}
        else // (localNumImagesLoaded == numImages)
        {
            // Total page number plugin only available in jspdf v1.0+
            if (typeof pdfFile.putTotalPages === 'function') 
            {
                pdfFile.putTotalPages(2);
            }
            // pdfFile.save("test.pdf");
            pdfFile.output('datauri');
        }
    };
    ++this.numImagesLoaded;
    console.log("this.numImagesLoaded", this.numImagesLoaded);
}

但是，img.onLoad似乎是async，导致pdfFile.output过早运行并将空格输出到 pdf 中。

我如何知道图像何时实际加载并添加到 pdf 中，以便我可以在正确的时间保存 pdf 文件？

标签： angularimagejspdf