Search code examples
angulartypescriptjspdfangular10

How to export a dynamic table into PDF in Angular 10


I want to make a PDF file using my existing dynamic table.I'm already tried the result will be 50% successful.I use jsPDF the result be like.I want change column width and Header text too...

Component.HTML

id="htmlData" #htmlData

I use this in my container div

Component.TS

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import * as jsPDF from 'jspdf'
 @ViewChild('htmlData') htmlData: ElementRef;
    public openPDF():void {
    let DATA = this.htmlData.nativeElement;
    let doc = new jsPDF('l','pt', 'a4');
    doc.fromHTML(DATA.innerHTML,15,15,{
      'width':400,
      // autoSize:true,
    });
    doc.output('dataurlnewwindow');
  }

Solution

  • use jsPDF-AutoTable - Table plugin for jsPDF npm

    jsPDF-AutoTable