为动态绑定的角网页的PDF生成一个PDF，并允许从仪表板页面下载它 我有一个由Angular和Django和MongoDB作为数据库制成的项目。 我在http：// localhost上有一个页面：4200/＃/print/layout 此打印页面正确从API获取所有数据

Question

此打印页面正确从API中获取所有数据，从而带来了Backend的数据。 如果我想打印/保存为PDF打印页面的网页，我可以为此做Ctrl +P。 但是现在，我正在考虑在此URL上放下一个下载PDF按钮-Http：// localhost：4200/＃/project

这里，我将提供所有必要的参数，例如 /？plant_id = 3＆project_id = 121＆username =[电子邮件保护]

和其他所需的标题。
即时不在那个打印页面上或查看该打印页面，我可以以pdf下载网页吗？ 我只希望CTRL + P功能在下载PDF按钮上工作。 我只想在前端（Angular）上完成所有这些操作，我不能使用后端，因为在印刷页面中，我的SVG非常非常复杂，还有一些其他复杂的样式，这些样式在Angular中进行了正确处理。 我已经尝试了后端，并且正在使用Weasyprint Python库，该库将HTML转换为PDF. 因此，我必须与Angular HTML模板写入相同的Django HTML模板。 正确制作HTML文件后，所有数据已被串联，然后使用Weasyprint将HTML转换为PDF。 但是，我的复杂的SVG并未适当地使用Weasyprint制造。 django html- （https：//i.sstatic.net/jpabc1y2.png）

通过weasyprint生成的PDF （Https：//i.sstatic.net/yjmzymkx.png）

是的，您可以绝对可以下载一个网页，而无需实际导航。我知道有几种方法：

使用HTML2Canvas + JSPDF：

generatePDF() {
  const iframe = document.createElement('iframe');
  iframe.style.visibility = 'hidden';
  iframe.src = 'http://localhost:4200/#/print/layout?plant_id=3&project_id=121';
  iframe.onload = () => {
    html2canvas(iframe.contentDocument.body).then(canvas => {
      const pdf = new jsPDF();
      pdf.addImage(canvas.toDataURL('image/png'), 'PNG', 0, 0, 211, 298);
      pdf.save('document.pdf');
      document.body.removeChild(iframe);
    });
  };
  document.body.appendChild(iframe);
}

HTTPClient的Antertantagity方法：

this.http.get('http://localhost:4200/#/print/layout?params', {responseType: 'text'})
  .subscribe(html => {
    // Insert into temp div and convert with html2canvas/jsPDF
  });

这些方法可能仍然与您的复杂SVG斗争。要在不重建模板的情况下进行完美渲染，请考虑使用
Https：//pagesnap.co

-它通过简单的API调用来处理复杂的SVG和样式。