Dynamic PDF Generation Angular , NodeJS

Question

Trying to generate a pdf something like this. Although this is not ideal. for more than a week has gone, not able figure which approach should i go for. Client Side : html to pdf generation didn't go well with jspdf ,html2pdf ,pdfMake.

No matter ,if it's achived on either client side or server side. Front-end: Angular, Back-end : NodeJS Any suggestions on this would be great

What i have tried so far,

  generatePDF(): void {
    const doc = new jsPDF();
    var margins = {
      top: 0, bottom: 60, left: 40, right: 200
    };
    const pdfTable = this.pdfTable.nativeElement;

    var html = htmlToPdfmake(pdfTable.innerHTML);

    const documentDefinition = { content: html ,pageMargins: [15, 20, 0, 0] };
    pdfMake.createPdf(documentDefinition).open();
  }

HTML

<div id="pdfTable" #pdfTable>
  <h3 style="text-align: center;">MANUFACTURING FEASIBILITY REVIEW RECORD</h3>
  <div *ngFor="let item of feasibilityFormValue; let i = index">
    <p>{{item.dept}}</p>
    <p>{{item.review}}</p>
    <p>{{item.feasible}}</p>
    <p></p>
  </div>
</div> 

Tried this basic html to convert to pdf. It's just not coming as expected. styles like flex won't work in libraries like jspdf

Answer 1

There might be limitations in terms of css support, you could fix it with simplifying the html structure, f.e. using a table instead of the paragraphs in the div.