So erstellen Sie dynamische Seitenumbruch in ionic pdfmake

Question

Ich benutze pdf machen Plugin in ionicframework, um PDF zu erstellen und downloaden, es funktioniert gut, aber wenn ich mehr Inhalte hinzufügen, die dynamisch sind, die Seite nicht automatisch Pausen bekommen kann jemand mir sagen wie man Seitenbruchteile automatisch mit Hilfe von pdf machen kann.Ich habe es versucht mit

Aber es bricht nicht die Seite.

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' 
    } 
    }; 

Answer 1

Es sieht aus wie die leeren Spalten sind das Problem. Das Problem ist häufiger und verursacht Probleme bei der Messung.

Beispiel: Sie haben eine bestimmte Spalte als leer wie diese

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

Aber Sie haben so zu geben:

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

Versuchen Sie, alle Spalten zu ändern, in dem Sie leer gegeben haben Zeichenketten und überprüfen Sie für weitere Informationen den Link: Pdfmake autopage break issues