[SOLVED] how to export a angular page into pdf with multiple page

how to export a angular page into pdf with multiple page

I have a very lengthy form in angular and i need to convert it into pdf. Since it is a very lengthy form i have to divide it into smaller chunks and show it in multiple pages in pdf. How can i achieve it. And i also need to add header and footer for every page.

I am using jsPDF and dom-to-image packages for pfd conversion.

Following is the code i wrote for pdf conversion:

exportPdf(){
    var doc = new jsPDF('potrait','px','a4');
    let imageData= new Image();
    imageData.src='../../assets/images/testimg.png';
    var filename="application";
    var options={};
    var img;
    var newImage;
    var node = document.getElementById('formContent');
    var numRowsToCut=3;
    var imagePieces=[];

      domtoimage.toPng(node, { }).then(function(dataUrl) 
      {
        img = new Image();
        img.src = dataUrl;
        newImage = img.src;
        img.onload = function(){

            var pdfWidth = img.width;
            console.log("image width "+pdfWidth);
            var pdfHeight = (img.height)/3;

            var width = doc.internal.pageSize.getWidth();
            console.log("width "+width);
            var height = doc.internal.pageSize.getHeight();

            for(var y = 0; y < numRowsToCut; ++y) {
              var canvas = document.createElement('canvas');
              var context = canvas.getContext('2d');
              context.drawImage(newImage, 0, y *pdfHeight, pdfWidth,pdfHeight, 0, 0,pdfWidth,pdfHeight);
              imagePieces.push(canvas.toDataURL());
          }            

            var docDefinition = {
            content: [{
                image: imagePieces[0],
                width: 500,
                pagebreak:'after'
            },
            {
              image: imagePieces[1],
              width: 500,
              pagebreak:'after'
          },
          {
            image: imagePieces[0],
            width: 500,
            pagebreak:'after'
        }],
            pageBreakBefore: function(currentNode) {
              return currentNode.style && currentNode.style.indexOf('myDivClass') > -1;
            }
          };
          pdfMake.createPdf(docDefinition).download(filename);
        };


      })
      .catch(function(error) {

        // Error Handling
        console.log(error);


      });

  }

Any help will be appreciated.

Solution