Okay, I figured this out.
-
You will need html2canvas and pdfmake. You do NOT need to do any injection in your app.js to either, just include in your script tags
-
On the div that you want to create the PDF of, add an ID name like below:
<div id="exportthis">
-
In your Angular controller use the id of the div in your call to html2canvas:
-
change the canvas to an image using toDataURL()
-
Then in your docDefinition for pdfmake assign the image to the content.
-
The completed code in your controller will look like this:
html2canvas(document.getElementById('exportthis'), { onrendered: function (canvas) { var data = canvas.toDataURL(); var docDefinition = { content: [{ image: data, width: 500, }] }; pdfMake.createPdf(docDefinition).download("Score_Details.pdf"); } });
I hope this helps someone else. Happy coding!