How To Print Custom Design PDF in Angular 8

To Print Custom Design PDF  in Angular. We need to install Plugin Like

   npm install pdfmake --save


  Then Import these two library in Component.ts

 
   import pdfMake from 'pdfmake/build/pdfmake';

   import pdfFonts from 'pdfmake/build/vfs_fonts';

   pdfMake.vfs = pdfFonts.pdfMake.vfs;

Now On HTML page We will add a button to generate PDF.

<button type="button" (click)="generatepdf()" >Click Me!</button>

Now on Component.ts

   generatepdf() {
    let Todaydate = this.datepipe.transform(this.Payslip.Todaydate, 'MMMM d, y');
    const documentDefinition = {
      template: [
        {
          text: 'Salary Slip',
          bold: true,
          fontSize: 20,
          alignment: 'center',
          margin: [0, 0, 0, 20]
        },
        {
          text: 'PaySlip For the Month '
        },
        {
          columns: [
            [{
              text:'Company Address' + this.Payslip.CompanyAddress
            },
              {
              text: 'EmployeeName : ' + this.Payslip.EmployeeName
              }
            ],
          ]
        }]
    };

     pdfMake.createPdf(documentDefinition).open();

  }

Now you can also add any dynamic data on button click!!