How to print multiple PDF's using print.js in angular 9

Question

I have tried to print PDF by using print.js library and it's working fine for single PDF print. now when I am trying to print multiple PDFs, it's throwing an error: ERROR Multiple Choices.. also, I have tried with plain JS but it prompts multiple times for multiple documents.

Below is the code we are using.

printJS({ 
         printable: ['dummy.pdf', 'dummy1.pdf'], 
         type:'pdf'
        });

please find the attachment.

Any help much appreciate!!

Answer 1

Finally, after spending 1 week, I am able to print multiple PDF's using print.js in angular 9. Below are the following steps to print multiple pdfs:

1. Install npm module: PDF-lib

   npm i pdf-lib

2. import npm module in the angular file and merge multiple pdfs into single pdfs using below code(say app.components.ts)

   import { PDFDocument } from 'pdf-lib'
   @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss']
   })
   
   export class AppComponent {
   title = 'print-multiple-pdfs';
   
   /* Convert the merged pdf array buffer to blob url for print or open in browser.*/
   downloadFile(data) {
    const blob = new Blob([data], { type: 'application/pdf' });
    const url= window.URL.createObjectURL(blob);
    //window.open(url);
    printJS({
      printable: url,
      type: 'pdf',
    })
   }
   
   async printPDFS() {
    /* Array of pdf urls */
    let pdfsToMerge = ['https://cors-anywhere.herokuapp.com/https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf', 'https://cors-anywhere.herokuapp.com/http://africau.edu/images/default/sample.pdf', 'https://cors-anywhere.herokuapp.com/https://www.hq.nasa.gov/alsj/a17/A17_FlightPlan.pdf']
   
    const mergedPdf = await PDFDocument.create();
    for (const pdfCopyDoc of pdfsToMerge) {
    const pdfBytes = await fetch(pdfCopyDoc).then(res => res.arrayBuffer())
    //const pdfBytes = fs.readFileSync(pdfCopyDoc);
    const pdf = await PDFDocument.load(pdfBytes);
    const copiedPages = await mergedPdf.copyPages(pdf, pdf.getPageIndices());
    copiedPages.forEach((page) => {
      mergedPdf.addPage(page);
    });
   }
   const mergedPdfFile = await mergedPdf.save();
   this.downloadFile(mergedPdfFile);
    }
   }
   

3. Call the function for print (app.component.html)

   <button (click)="printPDFS()">print pdfs</button>

Reference: pdf-lib

Answer 2

At the moment print.js doesn't support printing multiple files. I would try to merge the files first into a single file and then printing that one file. This creates one print preview only, providing a better user experience.

as workaround you could use the onPrintDialogClose Event

printJS({
    printable: 'page01.pdf',
    type: 'pdf',
    onPrintDialogClose: function() {
        printJS('page02.pdf');
    }
})