javascript - 如何对动态数据使用pdfMake

我刚接触过角度，我尝试使用pdfMake，我可以将其用于静态数据，但不能通过动态数据来实现，我希望您能帮助我实现这一点，因为我在整个互联网上进行了搜索，却无法完全理解我该如何实现。提前致谢。

employee.component.ts

getAllEmployees(){
    this.restService.GetAllEmployees().subscribe((res: any) => {
    this.employees = res.data.employees
    for(var i = 0; i< this.employees.length; i++) {
    this.array = this.employees[i]
    console.log(this.array)
    }
  })
}

generatePdf(){
  const documentDefinition = this.getDocumentDefinition();
  pdfMake.createPdf(documentDefinition).open();
}

getDocumentDefinition() {
  return {
    content: [
        {
        table: {
          headerRows: 4,
          widths: [ '*', 'auto', 100, '*' ],
          body: [
            [ 'Name', 'Second', 'Third', 'The last one' ],
            [ this.array.firstName_FL, 'Value 2', 'Value 3', 'Value 4' ],
          ]
        }
      }
    ]
  };
}
ExportAsPDF(){
  this.generatePdf();
}

我试过使用this.array.firstName_FL但是它只带有最后一个索引

最佳答案

尝试这样的事情。请注意，这未经测试。

getDocumentDefinition() {
    return {
        content: [
            {
            table: {
            headerRows: 4,
            widths: [ '*', 'auto', 100, '*' ],
            body: [[ 'Name', 'Second', 'Third', 'The last one' ]]
                .concat(this.employees.map((el, i) => [el.firstName_FL, el['secondPropHere'], el['thirdPropHere'], el['fourthPropHere']]))
            }
        }
        ]
    };
}

抱歉，格式化不起作用。背后的整个想法是，最后，body必须是一个数组数组：


第一个数组将是标题（如thead / tr / th）
第二个数组将是第一个数据行（如tbody / tr / td）
第三个数组->第二个数据行，依此类推


Concat将只返回一个新数组，其中包含标头数组，然后是每个员工数据的数组（map高阶函数）。

el['secondPropHere'] - just remove square brackets and use the dot notation to get your desired property for the second prop, like `el.secondProp`.