首页 > 解决方案 > 如何在pdfMake的页眉/页脚中使用类变量/调用函数

问题描述

我在 Angular 8 应用程序中使用 pdfMake。该类有一个invoice填充了正确数据的对象。我想在 pdf 的标题中制作一个表格,该表格将包含在所有页面中。我无法使用对象变量并出现错误。如果我调用一个函数来返回一个表,它也不起作用。

TypeError: Cannot read property 'invoice' of undefined

下面是 pdfMake 的标题片段。

header: function (currentPage, pageCount, pageSize) {
        return [
          { text: 'simple text' + this.invoice.branch.name , alignment: (currentPage % 2) ? 'left' : 'right' },
          { canvas: [{ type: 'rect', x: 170, y: 32, w: pageSize.width - 170, h: 40 }] }
        ]
      }

如果使用调用函数。

header: function (currentPage, pageCount, pageSize) {
        this.getInvoiceHeaderObject(currentPage, pageCount, pageSize, this.invoice);
      }

功能

getInvoiceHeaderObject(currentPage, pageCount, pageSize, invoice: Invoice) {
    return {
      table: {
        widths: [25, '*', '*', 45, 55],
        body: [
          [
            {
              text: 'Invoice No.',
              style: 'tableHeader',
              alignment: 'left'
            },
            {
              text: 'VAT Number',
              style: 'tableHeader',
              alignment: 'left'
            },
            {
              text: 'CASH SALE INVOICE',
              style: 'tableHeader',
              alignment: 'left'
            },
            {
              text: 'Branch',
              style: 'tableHeader',
              alignment: 'center'
            },
            {
              text: 'Date',
              style: 'tableHeader',
              alignment: 'right'
            },
          ],
          [
            {
              text: invoice.invoiceNumber,
              alignment: 'left'
            },
            {
              text: invoice.customer.vat,
              alignment: 'left'
            },
            {
              text: currentPage + '/' + pageCount,
              alignment: 'left'
            },
            {
              text: invoice.branch.name,
              alignment: 'center'
            },
            {
              text: 'data',
              alignment: 'right'
            }
          ]
        ]
      }
    };
  }

标签: javascriptangularpdfpdfmake

解决方案


推荐阅读