Is it possible to export HTML to PDF or generate pdf in AngularJs without Using Other JS reference like jSPDF, PHANtom,etc

[Dev Kant kumar]

Hi Developer,

I need to export any HTML (Div) to PDF using AngularJs only.

or can say need to generate PDF using AngularJS.

I done googling much more but not able to get any solution to generate PDF in angularJs without using JSPDF or phantom and etc.

is there any Directive or events available for PDF generation in AngularJS.

I am not looking for PDF viewer. I am looking for PDF generation.

I am looking forward to hearing from you ASAP.

Thanks in Advance.

[Daniel Lidström]

Yep, here's how: http://mrrio.github.io/jsPDF/

[Sander Elias]

Hi Daniel,

The OP specifically asked for something that's NOT jspdf..... 

Regards

Sander 

[Daniel Lidström]

Oops sorry, I read phantom only. Friday afternoon dyslexia… Disregard!

—
Daniel

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/bZef6hlcVX0/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

[Rani Radcliff]

Did you every find a solution to this?  I am having the same problem.

[Petr Meca]

I found something, try to look at here https://github.com/bpampuch/pdfmake

[marcus whelan]

Like before he said something that is not pdfmake. 

However I have looked at pdfMake and it looks interesting. Can anyone direct me to an example of using pdfmake with angularjs. I have looked all over the place and have not found any examples of with the logic in the controller and what the view actually looks like. All I ever see are pure javascript examples. 

[pras...@suventure.in]

Hi marcus,

you can find the pdfmake angular example code here..

http://stackoverflow.com/a/34162901/2148827

[rajesh tamire]

Hi Markus,

you can find proper documentation for using pdfMake in angular here..

http://gonehybrid.com/how-to-create-and-display-a-pdf-file-in-your-ionic-app/

However i need to export html to pdf in angular 2. is there any documentation for angular 2 ?

[Esakkiappan .E]

Hi Dev,

How you done with the Jspdf. I am unable to open in IE , Bcoz IE blocking blob url... 

here my code. viewRiskId is a div element.

converToPdf: function(viewRiskId){

        html2canvas(viewRiskId, {

                onrendered: function (canvas) {

                    var data = canvas.toDataURL("image/jpeg");

                    var doc ;

                    if(canvas.height < canvas.width){

                        doc = new jsPDF("l","pt",[canvas.width,canvas.height]);

                    } else{

                    doc = new jsPDF("p","pt",[canvas.height,canvas.width]);

                    }

                    doc.setProperties({

                    title: 'Risk Details',

                    });

                    doc.addImage(data, 'JPEG', 0, 0, canvas.width, canvas.height);

                    var blob = doc.output("blob");

                    if (navigator.appVersion.toString().indexOf('.NET') > 0){

                    var myWindow = window.open();

                        var doc = myWindow.document;

                        doc.open();

                        doc.write( "<link rel=\"stylesheet\" href=\"ui/css/style.css\" type=\"text/css\" />" );

                        doc.write( "<link rel=\"stylesheet\" href=\"ui/css/bootstrap.min.css\" type=\"text/css\" />" );

                        doc.write( "<link rel=\"stylesheet\" href=\"ui/css/fonts.css\" type=\"text/css\" />" );

                        doc.write( "<link rel=\"stylesheet\" href=\"ui/css/font-awesome.min.css\" type=\"text/css\" />" );

                        doc.write( "<title>Risk Details</title>" );

                        doc.write(viewRiskId.outerHTML);

                        doc.close();

                } else{

                        window.open(URL.createObjectURL(blob));

                }

                }

            });

On Wednesday, September 23, 2015 at 7:02:05 PM UTC+5:30, Dev Kant kumar wrote:

[Esakkiappan .E]

Hi Dev..

How you done with jsPdf. I tried but IE blocking blob url. here below is my code - viewriskId - div element

[Aamer Saeed]

I have done it like this but the problem is I have html table and i am using highcharts to show graphs on the basis of data. so when i try to export it in pdf my graphs are not showing.

app.controller("",function ($scope){
  $scope.ExportToPDF = function () {
         html2canvas(document.getElementById('divViews'), {
             onrendered: function (canvas) {
                 console.log(canvas);
                 var data = canvas.toDataURL()
                 var docDefinition = {
                     content: [{
                         image: data,
                         width: 500,
                     }]
                 };
                 pdfMake.createPdf(docDefinition).download("DailyView.pdf");
             }
         });
     }
});

[Nagesh Dhanashetti]

Hey Aamer,
did you find how to do it?
I'm also in a similar position and using somewhat similar code that you've shared. My HTML table contains user images with user names and scores. In PDF generated, I can see usernames and scores but images are not showing up.

Any help will be appreciated.

Thanks.

[Vikas Chauhan]

Hi Aamer, I used this same code but no data is returned from canvas. I have html tables in Id 'divViews'. I am getting data as ',' for now.

On Sunday, December 25, 2016 at 3:12:06 AM UTC+5:30, Aamer Saeed wrote: