javascript - 有什么方法可以在带有目的地的文本中添加大纲，以便可以在 ng2-pdf-viewer 的 getOutline 中查看

Question

使用ng2-pdf-viewer显示大纲，其中使用pdfmake库生成 pdf 。在定义文档定义时，是否有任何选项可以在 pdfmake 中将一些文本作为大纲文本？

标签： javascriptpdfmakeng2-pdfjs-viewer

Answer 1

如果我们知道需要概述的标题。为此功能实现的解决方案是使用 Toc（目录）

像这样定义文档定义：

generatePDF(): Promise<any>{
  this.documentDefinition = {
    content: [
     {
      tocItem: 'coverpage',
      stack: [
        {
          columns: [
            {
              text: '',
              width: '50%',
              tocItem: true,
            },
            {
              width: '*',
              text: ''
            }
          ]
        }
      ]
      pageBreak: 'after',
    },
    {
      text: 'Second toc header',
      tocItem: true,
      pageBreak: 'after',
      bold: true,
    }
   ]
}
// generate 
this.generatedPDF = pdfMake.createPdf(this.documentDefinition)
this.generatedPDF.getBuffer((buffer) => {
    this.pdfSrc = buffer
})
}

在加载 ng2-pdf-viewer 后使用：

afterLoadComplete(pdf: PDFDocumentProxy): void {
   this.pdf = pdf
   const toc = this.generatedPDF.docDefinition.content.filter( content => 
   content.toc)
   this.loadOutline(toc)
}

loadOutline(toc: any): void {
  const outlineTitles = [
    'item 1',
    'item 2',
    'item 3',
    'item 4'
  ]
  this.pdf.getDestinations().then((outline: any[]) => {
     this.outline = Object.entries(outline).map( (item, index) => 
     Object.assign(item, {title : outlineTitles[index]}))
  })
}

因此将获得带有目的地的标题。