网站搜索

angular - 如何使用 PDFmake 仅在第一页显示页眉


我正在尝试使用 PDFmake 构建一个动态发票。我遇到的问题是,页眉在第一页显示得很完美,但从第二页开始就会与我生成的表格重叠。我尝试过的两种可能的解决方案是,从第二页开始移除页眉,以及调整表格位置以使其位于页眉下方,但两种方法都没有成功。

let docDefinition: TDocumentDefinitions = {
  header: {
    margin: [35, 35, 0, 50],
    width: 200,
      image: `image base 64`,
      alignment: 'right'
  
    },
  footer: {
    margin: 10,
    fontSize: 7,
    columns: [
      { text: new Date().toDateString(), alignment: 'left' },
      { text: `Company Name | ${this.pdfData.quotation.employeeName}  `, alignment: 'center' },
      { text: '', alignment: 'right' }
    ]},

我尝试使用分页符从第二页开始删除页眉,但它完全删除了页眉。文档在这种情况下也没有什么帮助。

答案#1

你可以像这样使用函数:

...
    header: function (page, pages) {
      if (page === 1) {
        return {
          image: `image base 64`,
          alignment: "right",
          margin: [35, 35, 0, 50],
          width: 200
        }; 
      } else {
        return;
      }
    },
...

注意:不要使用 lambda ()=> 函数

祝你好运!~

答案#2

content: [
    {
      image: `data:image/png;base64,${image}`,
      margin: 0,
      width: '600',
      pageBreak: 'after'
     
    }
  ],
  header: function(currentPage, pageCount, pageSize) {
    if (currentPage === 1) {
      return  [{
        image: `data:image/png;base64,${image}`,
        margin: 0,
        width: pageSize.width,
        pageBreak: 'after'
      }];
    } else {
      return {columns: [{text:'Medication Report', margins:[20, 20, 0, 20], style: 'maintitle' },
      { 
        image: `data:image/png;base64,${headerLogo}`,
        width: 50,
        alignment: 'right'
      }]};
    }
  },

通过将页面页眉设置为与首页相同,我已经成功完成了封面图片