Question

我正在使用angular7。我想将列表中的数据下载为PDF。我尝试如下进行操作，但事实并非如此。它会根据需要打印控制台屏幕，但不会下载。带有jsPDF和jspdf-autotable下载的npm。

.ts代码：


import { DepartmanModal} from 'app/core/departman/departman.model';
import * as jsPDF from 'jspdf';
import 'jspdf-autotable';

export class HomeComponent implements OnInit {
    departmanList: Array<DepartmanModal>;
    doc: any;
    col = ['Details', 'Values'];
    rows: Array<any> = new Array<any>();
    temp: any;

  constructor( private departmanService: DepartmanService) {
        this.departman();
    }
    departman() {
        this.departmanService.getAll().subscribe(data => {
            this.departmanList= data.body;
        });
    }

convert() {
        this.doc = new jsPDF();
        this.departmanList.forEach(element => {
            this.temp = [element.id , element.name];
            this.rows.push(this.temp);
        });
        console.log(this.doc);
        this.doc.autoTable(this.col , this.rows);
        console.log( this.doc.autoTable(this.col , this.rows)); //  It prints the console screen as I want, but it doesn't download.
        this.doc.save('home.pdf');
    }
}

.html代码：

 <div (click)="convert()" class="example">
              <span class="iconPDF"> Click for Download</span>
     </div>

Answer 1

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_a_download

在PDF中添加“下载”属性。

Answer 2

尝试将您的代码更改为此，以查看其是否正常工作

 import jsPDF from 'jspdf';

 let doc = new jsPDF();
 this.departmanList.forEach(element => {
    this.temp = [element.id , element.name];
    this.rows.push(this.temp);
 });

 doc.autoTable(this.col , this.rows);
 doc.save('home.pdf');

您可以找到示例here

如何在角度导出pdf？

2 个答案: