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!!
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!!
Share Improve this question edited Jul 27, 2020 at 4:38 Priyank asked Jul 24, 2020 at 7:34 PriyankPriyank 3,8684 gold badges32 silver badges50 bronze badges 1- 1 Have you tried looping the array of pdfs you wish to print? So sending multiple print mands? – Tschallacka Commented Jul 27, 2020 at 4:40
3 Answers
Reset to default 7Finally, 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:
Install npm module: PDF-lib
npm i pdf-lib
import npm module in the angular file and merge multiple pdfs into single pdfs using below code(say app.ponents.ts)
import { PDFDocument } from 'pdf-lib' @Component({ selector: 'app-root', templateUrl: './app.ponent.html', styleUrls: ['./app.ponent.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./https://www.w3/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf', 'https://cors-anywhere.herokuapp./http://africau.edu/images/default/sample.pdf', 'https://cors-anywhere.herokuapp./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); } }
Call the function for print (app.ponent.html)
<button (click)="printPDFS()">print pdfs</button>
Reference: pdf-lib
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');
}
})
According to the documentation
printable - Document source: pdf or image url, html element id or json data object.
It implies to only allow one printable at each time.
So, I'd just try to loop through it's basic usage (call printJS()
and just pass in a PDF document url)
var pdfs_list = ['dummy.pdf', 'dummy1.pdf'];
for (var i = 0; i < pdfs_list.length; i++) {
printJS(pdfs_list[i]);
}
Either that or you concatenate the files server-side like pbachman suggests.