如何通过在angular2中使用jsPDF实现图像中的模板

Question

我正在使用jspdf将json数据转换为pdf。但是现在我需要设计与使用jsPDF给出的模板相同的模板。那可以实现吗？ 如果可以的话，任何人都可以帮助我实现这一目标。

到目前为止，我已经完成了

DEMO。

HTML：

<button class="pull-right" (click)="captureScreen()">PDF</button>
<div class="container" ></div>
<iframe id="convertToPdf" type="application/pdf"  width="100%" height="100%" [ngStyle]="{display: (displayTable ? 'block' : 'none')}"></iframe>

Ts：

captureScreen() {
    this.displayTable = true;
    var doc = new jsPDF();
    var col = ["year", "budget", 'exclude', 'expenses'];
    var rows = [];
    for (var i = 0; i < this.items.budget.length; i++) {
      var temp = []
      for (var key in this.items.budget[i]) {
        temp.push(this.items.budget[i][key])
      }
      rows.push(temp);
    }
    doc.text(100, 10, this.items.title.title);
    doc.text(20, 30, "Company:"+ this.items.owner.company);
    doc.text(20, 40, "Address:"+ this.items.owner.address);
    doc.text(20, 50, "Suite:"+ this.items.owner.suite);
    doc.text(140, 30, "Cap:"+ this.items.owner.cap);
    doc.text(140, 40, "Gross Up%:"+ this.items.owner.gross);
    doc.text(140, 50, "Cap Percent%:"+ this.items.owner.capPercent);

    doc.autoTable(col, rows,{
    startY: 60,
    margin: {
        top: 60
    }});
    document.getElementById("convertToPdf").setAttribute('src', doc.output('datauri'))
  }