使用pdfmake创建PDF只是将HTML写入PDF中。

Question

使用pdfmake创建PDF只是将HTML写入PDF中。

3

我试图从使用Angular创建的视图中创建PDF。问题是PDF看起来像这样：

它不能处理Angular标记吗？

   var docDefinition = { content: printHtml };
   pdfMake.createPdf(docDefinition).download('optionalName.pdf');

- Daniel Gustafsson

试一下这个：pdfmake - Verri

2个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Suhail Akhtar · Answer 1

Pdfmake正在正确地执行其工作，它将所有原始HTML打印到PDF中。您希望以HTML格式打印，但pdfmake不是这样工作的。通过提供HTML代码，您无法生成格式化的PDF文件，您需要创建一个JavaScript对象，其中包含文档定义，该文档定义包含您的内容和样式。

您可以访问此链接获取基本示例，并在pdfmake的github页面上此处查看更多复杂的示例。

祝你好运

- Farrukh Ishaq Choudhary · Answer 2

// use npm package and initialise the pdfMake.
const pdfMake = require('pdfmake/build/pdfmake.js')
const pdfFonts = require('pdfmake/build/vfs_fonts.js')
pdfMake.vfs = pdfFonts.pdfMake.vfs


function showPDF() {
const statHeader = { text: data in header not the Header 
header,bold: true}
const content = preparePDF(yourHTML)
const statFooter = 'data in footer not Footer footer, To add a 
footer check the pdfMake documentation for footer.'
const name = ''

const docDefinition = {
        // Add page count
        footer: function (currentPage, pageCount) {
          return {
            margin: 10,
            columns: [{ text: currentPage.toString() + ' of ' + 
pageCount, alignment: 'center' }]
          }
        },
        header: { text: name, style: 'gameName' },
        content: [
          statHeader,
          content,
          statFooter
        ],
        styles: {
          gameName: {
                        fontSize: 16,
            bold: true,
            alignment: 'left',
            margin: [40, 20, 0, 80]
         }
        }
    }
 // creates pdf formated file with give name. 
 pdfMake.createPdf(docDefinition).download(`${name}.pdf`)
}

Wrap it in a function like
const htmlToPDF = require('html-to-pdfmake')
function preparePDF (yourHTML) {
let htmltoPDFData = []
const html = <div>yourHTML</div>
htmltoPDFData = htmlToPDF(html)
return htmltoPDFData
}