首页 > 解决方案 > Angular dom-to-image 如何连续加载图像?

问题描述

我的 Angular 项目中有以下代码,它生成图像并将其放入 pdf 中。我的问题是有时 node2 在 node1 之前加载。我怎样才能把这个代码放在图片2在图片1之后开始的一行中?

//var pdf;
let pdf = new jsPDF('l', 'px', [842 , 595]);


//picture 1
domtoimage.toPng(node1, { bgcolor: '#fff' })
  .then(function(dataUrl) {
    img = new Image();
    img.src = dataUrl;
    newImage1 = img.src;

    img.onload = function(){          
      pdf.addImage(newImage1, 'JPEG',  100, 10, 500, 300);
      pdf.addPage();
      console.log(1);
    };
  }).catch(function(error) {
    console.log(error)
});


//picture 2
domtoimage.toPng(node2, { bgcolor: '#fff' })
.then(function(dataUrl2) {
  img = new Image();
  img.src = dataUrl2;
  newImage2 = img.src;

  img.onload = function(){          
    pdf.addImage(newImage2, 'JPEG',  100, 10, 500, 300);
    pdf.addPage();
    console.log(2);
  };
}).catch(function(error) {
  console.log(error)
});

标签: angular

解决方案


推荐阅读