angular 导出pdf

要在 Angular 中导出 PDF，可以使用第三方库 jsPDF 和 html2canvas。

首先，需要安装这两个库：

npm install jspdf html2canvas

然后，在组件中引入这两个库以及 HttpClient：

import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import * as jsPDF from 'jspdf';
import html2canvas from 'html2canvas';

接着，创建一个方法来导出 PDF：

exportPdf() {
  const data = document.getElementById('pdf-content');
  html2canvas(data).then(canvas => {
    const imgData = canvas.toDataURL('image/png');
    const doc = new jsPDF();
    const imgProps = doc.getImageProperties(imgData);
    const pdfWidth = doc.internal.pageSize.getWidth();
    const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
    doc.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
    doc.save('file.pdf');
  });
}

在这个方法中，首先使用 `html2canvas` 将要导出的 HTML 元素转换为 Canvas，然后将 Canvas 转换为图像数据。接着，创建一个 `jsPDF` 实例，并将图像添加到 PDF 中。最后，使用 `save` 方法将 PDF 文件下载到本地。

注意，在这个例子中，我们将要导出的 HTML 元素的 ID 设置为了 `pdf-content`，可以根据实际情况修改。

最后，在模板中添加一个按钮来触发导出 PDF 的方法：

<div id="pdf-content">
  <!-- PDF 内容 -->
</div>
<button (click)="exportPdf()">导出 PDF</button>