我如何 "save as pdf" mat-table in angular 6

Question

我用过angular-materialize 主题。我是 Angular 框架的初学者。但是我找不到将 table 导出为 pdf 的正确方法。

我已经从 https://material.angular.io/components/table/overview 这个官方网站。

我的要求是 select 日期，然后允许用户以 pdf 格式打印。如果有人有想法或例子，那将非常有帮助。

演示： https://stackblitz.com/angular/xbprlqrqjyq?file=app%2Ftable-basic-example.html

Answer 1

HTML:

Blockquote

  <button mat-button color="accent" (click)="print()">
   <mat-icon class="mat-24" aria-label="Example icon-button with a heart icon">print</mat-icon>
Print

Blockquote

Javascript/typescript:

import jsPDF from 'jspdf';
import 'jspdf-autotable';
print = () => {
  let doc = new jsPDF(); 
  doc.autoTable({
    head: [['Log','', 'Amount']],
    body: this.getLiveData() //returning [["log1", "0"], ["log2", "0"]]
  });
  doc.save('table.pdf')
}

Answer 2

此答案更新可能为时已晚，但仍可能对某些人有用。

mat-table-exporter - 这个 npm 包允许下载各种格式的 mat-table。

包裹Link：https://www.npmjs.com/package/mat-table-exporter

演示：https://stackblitz.com/edit/mte-demo

示例代码：

  <button mat-raised-button (click)="exporter.exportTable('json')">Json</button>
  <button mat-raised-button (click)="exporter.exportTable('txt')">Txt</button>

我如何 "save as pdf" mat-table in angular 6

How do I "save as pdf" mat-table in angular 6

export-to-pdf

angular6

angular-material-6

HTML:

Javascript/typescript: