使用angular2/typescript从html生成PDF文件

npm install html2canvas jspdf --save

ng generate component PdfGenerator

import { Component, OnInit } from '@angular/core';
import * as html2canvas from 'html2canvas';
import * as jspdf from 'jspdf';

@Component({
  selector: 'app-pdf-generator',
  templateUrl: './pdf-generator.component.html',
  styleUrls: ['./pdf-generator.component.css']
})
export class PdfGeneratorComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
  }

  generatePdf(): void {
    const element = document.getElementById('pdfContent');

    html2canvas(element).then((canvas) => {
      const imgData = canvas.toDataURL('image/png');
      const pdf = new jspdf.jsPDF();

      const imgProps = pdf.getImageProperties(imgData);
      const pdfWidth = pdf.internal.pageSize.getWidth();
      const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;

      pdf.addImage(imgData, 'PNG', 0, 0, pdfWidth, pdfHeight);
      pdf.save('generated.pdf');
    });
  }
}

<div id="pdfContent">
  <!-- 在这里放置要转换为PDF的HTML内容 -->
</div>

<button (click)="generatePdf()">生成PDF</button>