简体   繁体   English

无法在 NodeJS 中使用 html-pdf 生成 PDF(包含所有详细信息)

[英]cant generate the PDF(with all details) using html-pdf in NodeJS

I am a bit stuck when creating the PDF from the html template.从 html 模板创建 PDF 时,我有点卡住了。 if i use the static entries it does work but i am looking to generate the pdf for multiple items and the items can vary each time, i am not sure if i am missing something any suggestion guys please.如果我使用 static 条目,它确实可以工作,但我希望为多个项目生成 pdf,并且项目每次都会有所不同,我不确定我是否遗漏了任何建议。

after i added .map function in the pdfTemplate.js file as below to go through each object and get the price, it seems to not working properly after i added .map function in the pdfTemplate.js file as below to go through each object and get the price, it seems to not working properly

snippet from the main ./documents/pdfTemplate Js file来自主./documents/pdfTemplate Js 文件的片段

 customer_dataand_Itemsbought.map((eachitem) => {
        total = total + eachitem.price;
   return     `    <tr class="heading">
                       <td>Bought items:</td>
                       <td>Price</td>
                    </tr>
                    <tr class="item">
                       <td>First item:</td>
                       <td>${eachitem.price}$</td>
                    </tr>
                    <tr class="item">
                       <td>Second item:</td>
                       <td>${eachitem.price}$</td>
                    </tr>`;
      })` 

Note: PDF is still generating but missing every bit that i included after the.map function Note: PDF 仍在生成,但缺少我在之后包含的每一位。

main ./documents/pdfTemplate Js file./documents/pdfTemplate Js 文件

module.exports = (customer_dataand_Itemsbought) => {
  //customer_dataand_Itemsbought is array of objects[obj[0],obj[1],...] and at obj[0] is the customer details object and after that each index object contains the customer bought items detail/price 

  let customer_Name = customer_dataand_Itemsbought[0].user_FirstName;
  let receipt_Id = customer_dataand_Itemsbought[0].Invoice_No_latest;
  let total_Price;

  customer_dataand_Itemsbought.shift();

  const today = new Date();
  return `
    <!doctype html>
    <html>
       <head>
          <meta charset="utf-8">
          <title>PDF Result Template</title>
          <style>
             ........
          </style>
       </head>
       <body>
          <div class="invoice-box">
             <table cellpadding="0" cellspacing="0">
                <tr class="top">
                   <td colspan="2">
                      <table>
                         <tr>
                            <td class="title"><img  src="https://i2.wp.com/cleverlogos.co/wp-content/uploads/2018/05/reciepthound_1.jpg?fit=800%2C600&ssl=1"
                               style="width:100%; max-width:156px;"></td>
                            <td>
                               Datum: ${`${today.getDate()}. ${today.getMonth() + 1}. ${today.getFullYear()}.`}
                            </td>
                         </tr>
                      </table>
                   </td>
                </tr>
                <tr class="information">
                   <td colspan="2">
                      <table>
                         <tr>
                            <td>
                               Customer name: ${customer_Name} // this still appears on the PDF
                            </td>
                            <td>
                               Receipt number: ${receipt_Id} // this still appears on the PDF
                            </td>
                         </tr>
                      </table>
                   </td>
                    </tr>`;
// here i used the .map function to go through each array object. nothing appears from here onwards on the pdf 
      customer_dataand_Itemsbought.map((eachitem) => {
        total = total + eachitem.price;
       return `    <tr class="heading">
                       <td>Bought items:</td>
                       <td>Price</td>
                    </tr>
                    <tr class="item">
                       <td>First item:</td>
                       <td>${eachitem.price}$</td>
                    </tr>
                    <tr class="item">
                       <td>Second item:</td>
                       <td>${eachitem.price}$</td>
                    </tr>`;
      })` 
                 </table>
                 <br />
                 <h1 class="justify-center">Total price: ${total_Price}£</h1>
              </div>
           </body>
        </html>
        `;
    };

at server.js sideserver.js

const pdf = require("html-pdf");
const pdfTemplate = require("./documents/pdfTemplate");
pdf.create(pdfTemplate(customer_dataand_Itemsbought), {}).toFile("./filename.pdf", function (err, res) {
  if (err) {
    console.log(err);
  } 
});

在此处输入图像描述

When you have enclosed map function's body in curly braces - meaning you have multiple statements for processing data, you are expected to return from it explicitly:当您将 map 函数的主体括在花括号中时 - 这意味着您有多个用于处理数据的语句,您应该明确地从中返回:

customer_dataand_Itemsbought.map((eachitem) => {
        total = total + eachitem.price;
        return `<tr class="heading">
                       <td>Bought items:</td>
                       <td>Price</td>
                    </tr>
                    <tr class="item">
                       <td>First item:</td>
                       <td>${eachitem.price}$</td>
                    </tr>
                    <tr class="item">
                       <td>Second item:</td>
                       <td>${eachitem.price}$</td>
                    </tr>`;
      })

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM