如何在离子pdfmake中创建动态分页符

时间:2022-04-17 23:00:12

I am using pdf make plugin in ionicframework to create pdf and download it works fine but when I add more contents which are of dynamic the page doesn't get breaks automatically can anyone tell me how to make page break automatically using pdf make.I have tried using

我在ionicframework中使用pdf make plugin创建pdf并下载它工作正常但是当我添加更多动态内容时,页面不会自动中断,任何人都可以告诉我如何使用pdf make自动进行分页。我有试过用

pageBreakBefore: function (currentNode, followingNodesOnPage) {
      return currentNode.headlineLevel === 1 && followingNodesOnPage.length === 0;
    },

But it doesn't break the page.

但它并没有破坏页面。

Code:

码:

var dd = {
    pageSize: 'A4',
    pageOrientation: 'portrait',
    content: [
      { text: $translate.instant('{{"billnumber_message" | translate}}') + invoice.billno, alignment: 'left', style: 'subheader'},
       { text: $translate.instant('{{"billdate_message" | translate}}') + currentbilldate, alignment: 'right', style: 'subheader'},

      { text: $translate.instant('{{"billto_message" | translate}}') + invoice.name + ',\n' + invoice.location + ',\n' + invoice.mobileno + '\n', style: 'subheader' },
      {
        style: 'itemsTable',
        table: {
          widths: ['*', '*', '*', '*'],
          body: [
            [
                { text: $translate.instant('{{"billDescription_message" | translate}}'), style: 'itemsTableHeader' },
                { text: $translate.instant('{{"billquantity_message" | translate}}'), style: 'itemsTableHeader' },
                { text: $translate.instant('{{"billrate_message" | translate}}'), style: 'itemsTableHeader' },
                { text: $translate.instant('{{"billtotal_message" | translate}}'), style: 'itemsTableHeader' },
            ]
          ].concat(items)
        }
      },
      {
        style: 'totalsTable',
        table: {
          widths: [75, '*', 75],
          body: [
            [
              '',
              $translate.instant('{{"billtotalamount_message" | translate}}'),
              invoice.Subtotal,
            ],
            [
              '',
              $translate.instant('{{"billothercharges_message" | translate}}'),
              invoice.OtherCharges,
            ],
            [
              '',
              $translate.instant('{{"billdebitcapture_message" | translate}}'),
              invoice.debitcapure,
            ],
            [
              '',
              '',
              '',
            ],
            [
              '',
              '',
              '',
            ]
          ]
        },
        layout: 'noBorders'
      },
      {
        style: 'subheaderbalance',
        table: {
          widths: [75, '*', 75],
          body: [
            [
              '',
              $translate.instant('{{"billamountgiven_message" | translate}}'),
              invoice.Total,
            ]
          ]
        },
        layout: 'noBorders'
      },
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: $translate.instant('{{"billhistory_message" | translate}}') + invoice.Previousbill, alignment: 'center' },
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      /*{ text: $translate.instant('{{"billpreviousdebit_message" | translate}}') + invoice.PreviousDebitCapture, alignment: 'right' },*/
      {
        style: 'itemsTable',
        table: {
          widths: [75, '*', 75],
          body: [
            [
              { text: $translate.instant('{{"billdate_message" | translate}}'), style: 'itemsTableHeader' },
              { text: $translate.instant('{{"description_message" | translate}}'), style: 'itemsTableHeader' },
              { text: $translate.instant('{{"amount_message" | translate}}'), style: 'itemsTableHeader' },
            ]
          ].concat(previousbillitems)
        },
      },
      {
        style: 'totalsTable',
        table: {
          widths: [75, '*', 75],
          body: [
            [
              '',
              $translate.instant('{{"billpreviousdebit_message" | translate}}'),
              invoice.PreviousDebitCapture,
            ],
            [
              '',
              $translate.instant('{{"billtotaldebit_message" | translate}}'),
              totaldebit,
            ],
            [
              '',
              $translate.instant('{{"billtotaldebitcapture_message" | translate}}'),
              invoice.debitcapure,
            ]
          ]
        },
        layout: 'noBorders'
      },
      {
        style: 'subheaderbalance',
        table: {
          widths: [75, '*', 75],
          body: [
            [
              ':',
              $translate.instant('{{"billledgerbalance" | translate}}'),
              (totaldebit - invoice.debitcapure),
            ]
          ]
        },
        layout: 'noBorders'
      },
      //{ text: $translate.instant('{{"billtotaldebit_message" | translate}}') + totaldebit , alignment: 'right' },
      //{ text: $translate.instant('{{"billtotaldebitcapture_message" | translate}}') + invoice.debitcapure, alignment: 'right'},
      //{ text: '', alignment: 'left'},
      //{ text: $translate.instant('{{"billledgerbalance" | translate}}') + (totaldebit - invoice.debitcapure), alignment: 'right', style: 'subheader'},
      // add signature
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: '', alignment: 'right'},
      { text: $translate.instant('{{"billsignature_message" | translate}}'), alignment: 'right', style: 'subheader'},
      { text: '', alignment: 'right'},
    ],
    pageBreakBefore: function (currentNode, followingNodesOnPage) {
      return currentNode.headlineLevel === 1 && followingNodesOnPage.length === 0;
    },
    styles: {
      subheader: {
        fontSize: 16,
        bold: true,
        margin: [0, 20, 0, 5]
      },
      subheaderbalance: {
        fontSize: 16,
        bold: true,
        alignment: 'right',
        margin: [0, 20, 0, 5]
      },
      itemsTable: {
        alignment: 'center',
        margin: [0, 5, 0, 15]
      },
      itemsTableHeader: {
        bold: true,
        fontSize: 13,
        color: 'black',
        alignment: 'center'
      },
      itemsTableAmount: {
        bold: true,
        fontSize: 13,
        color: 'black',
        alignment: 'right'
      },
      totalsTable: {
        bold: true,
        alignment: 'right',
        margin: [0, 30, 0, 0]
      },
    },
    defaultStyle: {
      //font: 'TSCu_SaiIndira'
    }
  };

1 个解决方案

#1


0  

It looks like the empty columns are the problem. The problem is more frequent and causes problems in the measurement.

看起来空列是问题所在。问题更加频繁,并导致测量中出现问题。

Example: You have given a particular column as empty like this

示例:您已将特定列设为空,如下所示

       [
          '',
          $translate.instant('{{"billtotaldebit_message" | translate}}'),
          totaldebit,
        ],

But you have to give like this:

但你必须这样给:

[
          ' ',
          $translate.instant('{{"billtotaldebit_message" | translate}}'),
          totaldebit,
        ],

Try to change all the columns where you have given empty strings and check for more info check the link: Pdfmake autopage break issues

尝试更改已给出空字符串的所有列并检查更多信息检查链接:Pdfmake autopage break问题

#1


0  

It looks like the empty columns are the problem. The problem is more frequent and causes problems in the measurement.

看起来空列是问题所在。问题更加频繁,并导致测量中出现问题。

Example: You have given a particular column as empty like this

示例:您已将特定列设为空,如下所示

       [
          '',
          $translate.instant('{{"billtotaldebit_message" | translate}}'),
          totaldebit,
        ],

But you have to give like this:

但你必须这样给:

[
          ' ',
          $translate.instant('{{"billtotaldebit_message" | translate}}'),
          totaldebit,
        ],

Try to change all the columns where you have given empty strings and check for more info check the link: Pdfmake autopage break issues

尝试更改已给出空字符串的所有列并检查更多信息检查链接:Pdfmake autopage break问题