角度js中的Html到Pdf转换

时间:2016-12-03 11:08:28

标签: html css angularjs pdf html2pdf

我正在尝试将html转换为pdf。是否有任何自定义指令,我可以使用。我也试图从npm网站使用angular-save-html-to-pdf,但使用时有一些错误。 有没有其他方法可以将角色js中的html转换为css。

2 个答案:

答案 0 :(得分:4)

jsPDF库支持此功能。它使用的是html2canvas。他们的网站上有一个demo

var doc = new jsPDF();

// We'll make our own renderer to skip this editor
var specialElementHandlers = {
    '#editor': function(element, renderer){
        return true;
    }
};

// All units are in the set measurement for the document
// This can be changed to "pt" (points), "mm" (Default), "cm", "in"
doc.fromHTML($('body').get(0), 15, 15, {
    'width': 170, 
    'elementHandlers': specialElementHandlers
});

答案 1 :(得分:1)

您可以将PdfMake与angularjs一起使用。

我用pdfmake制作了一个样本。

var docDefinition = {
      content: [
        {
          text: 'Criketers and scores'
        },
        {
          style: 'demoTable',
          table: {
            widths: ['*', '*', '*'],
            body: [
              [{text: 'Name', style: 'header'}, {text: 'Matches', style: 'header'},
                {text: 'Score', style: 'header'}
              ],
              ['Sachin', '344', '52'],
              ['Sanga', '320', '89'],
              ['Ponting', '300', '68'] 
            ]
          }
        }
      ],
      styles: {
        header: {
          bold: true,
          color: '#000',
          fontSize: 11
        },
        demoTable: {
          color: '#666',
          fontSize: 10
        }
      }
    };

    $scope.openPdf = function() {
      pdfMake.createPdf(docDefinition).open();
    };

    $scope.downloadPdf = function() {
      pdfMake.createPdf(docDefinition).download();
    };

<强> DEMO