如何在angular5的jspdf自动表格的底部添加文本

时间:2018-11-01 16:30:10

标签: angular5 jspdf jspdf-autotable

我在我的angular5应用程序中使用jspdf自动表。我正在为jspdf自动表生成动态数据。我的问题是如何在表格底部添加文本?

    const columnHead = [];
    const columnRow = [];
    this.tableColumns.filter(x => {
      columnHead.push(this.capFirstLtr(x.title));
    });
    this.tableData.filter((x, y) => {
      x.slaMetFlag = (this.mapData[y].slaMetFlag ? this.capFirstLtr(this.mapData[y].slaMetFlag) : '-');
      columnRow.push([x.date, x.slaMetFlag, x.srType, x.srID, x.srStatus, x.aof, x.ppm, x.deviceID, x.siteID, x.branchID]);
    });
    const doc = new jsPDF();
     doc.text('Showing data from ' + moment(this.requestApi.fromDate).format('MM/DD/YYYY') + ' to ' + moment(this.requestApi.toDate).format('MM/DD/YYYY'), 5, 10);
    doc.autoTable(columnHead, columnRow, {
      styles: { overflow: 'linebreak', halign: 'center', fontSize: 7},
      tableWidth: 200,
      margin: 5,
      theme: 'grid',
      startY: 15,
      addPageContent: function(data) {
        console.log('data', data);
      }
    });
    doc.save('SR View Export');
  }

在上面的代码中,如何在jspdf自动表完成后添加文本?

1 个答案:

答案 0 :(得分:1)

如果您想了解有关最后绘制的表格的信息,可以使用doc.autoTable.previous。它具有 doc.autoTable.previous.finalY 属性,该属性具有页面上最后打印的y坐标的值。可用于绘制文本,多个表格或在表格之后的其他内容。

doc.autoTable.previous.finalY使用此属性。

doc.autoTable(headers, data);

let finalY = doc.autoTable.previous.finalY; //页面上的y位置

doc.text(20, finalY, "Hello!")