As title says, is there any PDF creator / generator for Angular?
I have seen https://github.com/MrRio/jsPDF, but can't find any for Angular. I want to make an html page to a pdf file for download.
- 1I've the same question. I've tried jsPDF but it has some problems, like alignment issues. Sometimes it seems as if some layers overlap its parent's border and some times image does not appear. So, i was wondering if there is an AngularJS library or anyother alternative library/module for creating PDF out of the web page.Temp O'rary– Temp O'rary2015-06-18 04:48:30 +00:00Commented Jun 18, 2015 at 4:48
- 1Use this solution from a 99% similar question here: stackoverflow.com/questions/34049956/…NaN– NaN2016-06-24 13:52:00 +00:00Commented Jun 24, 2016 at 13:52
Add a comment |
4 Answers
You can wrap the JavaScript project you mentioned into a service that you call throughout your app. This is actually a rather standard practice and it also isolates your code if you ever need to change the underlying implementation .
1 Comment
Sole
How can this be achieved?
Looks like @Mike had it close there. A few quick changes generated a decent looking file and brought up a print pop-up.
1 - Give the area that you want to print an ID of 'printArea'
2 - Add the $window service
$scope.printIt = function(){ var table = document.getElementById('printArea').innerHTML; var myWindow = $window.open('', '', 'width=800, height=600'); myWindow.document.write(table); myWindow.print(); }; 
1 Comment
Temp O'rary
This is a good idea. But what I am looking for is a solution similar to "Export to excel" where the user clicks a button and the file gets downloaded for you. Only in my case I want an "Export to PDF" option.
You can use window.print() which prints current HTML document. Use media queries to adjust styles document. You can build your document in fly and call print anytime you want
@media print { /* All your print styles go here */ #header, #footer, #nav { display: none !important; } } Some code from one of my project, print's only content from table:
$scope.print = function () { console.log('modal print'); var table = document.querySelector('.CSSTableGenerator').innerHTML; var myWindow = window.open('', '', 'width=800, height=600'); myWindow.document.write(table); myWindow.print(); }; 3 Comments
Sole
Can you put a fiddle together for this? Abit confused as to how this would work?
Sole
Hi Mike, how would this example work within Angular JS, also I want to save not print?
Mike
This example will work with AngularJS, you just have to find element programatically, put its content to iframe and print, like in example. You can't skip this print dialog with settings, its up to browser. SO maybe you should use jsPDF, it seems to be easy adjustable with angular, just say when/where do you want trigger print so I will try to help. You can provide some code.
There's this Angular directive wrapping up jsPDF functionality:
