¿ 如何在 pdfmake-wrapper 的页面上设置不同的背景？答案

【问题标题】：¿How set different background on pdfmake-wrapper's page?¿ 如何在 pdfmake-wrapper 的页面上设置不同的背景？
【发布时间】：2022-06-13 19:57:07
【问题描述】：

我在 Angular 13 上使用 pdfmake-wrapper，但我不明白如何像这个示例一样为每个页面设置不同的背景：

enter image description here

这是我自己生成pdf的方法：

public async generateFormat() {
    let imageOne!: any;
    let imageTwo!: any;
    let ancho!: any;
    let alto!: any;
    if (this.licencia.format === 'Municipal') {
      imageOne = this.formatoObject.licFrenteMunicipio;
      imageTwo = this.formatoObject.licVueltaMunicipio;
      ancho = 85;
      alto = 54;
    } else {
      imageOne = this.formatoObject.licFrenteEstado;
      imageTwo = this.formatoObject.licVueltaEstado;
      ancho = 54;
      alto = 85;
    }
    const pdf = new PdfMakeWrapper();
    PdfMakeWrapper.setFonts(pdfFonts);
    pdf.add(await new Img(imageOne).width(ancho).height(alto).build().then(async img => {
      pdf.add(await new Img(this.licencia.photo).width(25).height(25).absolutePosition(25,25).build());
      pdf.background(img);
      pdf.pageSize({
        width: ancho,
        height: alto
      })
    }));
    pdf.add('\n');
    pdf.add(await new Img(imageTwo).width(ancho).height(alto).build().then(async img => {
      pdf.add(await new Img(this.licencia.firm).width(25).height(25).absolutePosition(25,25).build());
      pdf.background(img);
      pdf.pageSize({
        width: ancho,
        height: alto
      })
    }));
    pdf.create().open();
  }

这是我尝试的结果：

enter image description here

【问题讨论】：

标签： angular pdf typescript-typings wrapper pdfmake

【解决方案1】：

Pdfmake 有一个名为background() 的函数，可以让你为每个页面设置不同的背景：

var documentDefinition = {
    background: function(currentPage) {
        if (currentPage === 1) {
            return {img: 'SRC_TO_BACKGROUND1'}
        } else {
            return {img: 'SRC_TO_BACKGROUND2'}
        }
    },

    content: [
        {text: 'text', pageBreak: 'after'},  // will have background 1
        {text: 'text', pageBreak: 'after'},  // // will have background 2
    ]
};

【讨论】：