Html 在 angular js 中转换为 Pdf

Question

我正在尝试将 html 转换为 pdf。是否有任何自定义指令，我可以 use.I 也尝试使用 npm 站点的 angular-save-html-to-pdf 但在使用时出现一些错误。在angular js.

中有没有其他方法可以将html转换为css

Answer 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

Answer 2

他们的网站上有 jsPDF library which supports this. It's using html2canvas. There is a 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
});

Html 在 angular js 中转换为 Pdf

Html To Pdf conversion in angular js

html

css

pdf

html2pdf

angularjs