我正在制作一个仪表板，其中router-outlet 中显示了不同的组件。我想生成“仅”router-outlet 中所有组件的 pdf。我认为jsPDF 可以解决问题。但问题是，我制作了一个 vc-export-pdf 按钮，它位于一个单独的组件 中。我正在检查如何使用 jsPDF，他们中的大多数人都使用参考来访问他们想要制作 pdf 的div。现在如何访问位于单独组件中的 div 的内容？
【问题讨论】：
标签： angular typescript jspdf html2canvas
这可能真的很棘手，但是要获取 div 的数据，您可以使用 ViewChild 但请记住，当您从 html div 使用 jsPDF 呈现时，需要呈现 div 并且它的内容需要呈现在 pdf 中.如果您想生成未呈现的内容的 pdf。我建议你从 jsPDF 创建一个 pdf，但都是用 jsPDF 的函数而不是 HTML 编写的。 如果您使用 HTML2Canva，带有 HTML 的 jsPDF 也可能不太方便，因为它会截取屏幕截图（如果您有太多东西，它可能会变得模糊并且不适合您的页面）并且您将无法复制 pdf 上的文本例如。
【讨论】：
const doc = new jsPDF('p', 'mm', 'a4', true); doc.addFileToVFS('Bitter.ttf', BITTER_FONT); doc.addFont('Bitter.ttf', 'bitter', 'normal'); try { const imgUb = new Image(); imgUb.src = 'assets/logo/logo.png'; doc.addImage(imgUb, 'png', 25, 15, 15, 15); const img = new Image(); img.src = 'assets/logo/img.png'; doc.addImage(img, 'png', 120, 12, 70, 20); } catch (err) { this.log.warn('Cannot load images'); } doc.text( doc.splitTextToSize('totototext, 160), 25, 45, );