首页 > 解决方案 > 使用jspdf将内容导出为pdf angular

问题描述

我正在尝试使用 jspdf 创建一个 pdf。但是我遇到了错误cannot create property 'header' on string 'Details'。我经历了这个问题如何修复:无法在字符串上创建属性“标题”但找不到解决方案。请帮助。提前致谢。这是我的转换功能

convert() {

    var doc = new jsPDF();
    var col = ["Details", "Values"];
    var rows = [];

    /* The following array of object as response from the API req  */

    var itemNew = [
      { id: 'Case Number', name: '101111111' },
      { id: 'Patient Name', name: 'UAT DR' },
      { id: 'Hospital Name', name: 'Dr Abcd' }
    ];


    itemNew.forEach(element => {
      var temp = [element.id, element.name];
      rows.push(temp);

    });

    doc.autoTable(col, rows);
    doc.save('Test.pdf');
  }

StackBLitz:https ://stackblitz.com/edit/angular-jspdf-xgoetc?file=app/app.component.ts

标签: javascriptangulartypescriptjspdfjspdf-autotable

解决方案


问题出autoTable()在您指定head和的函数中body

var col = [["Details", "Values"]];

改变autoTable()喜欢

 doc.autoTable({
        head: col,
        body: rows
    });

更新片段:

convert() {

    var doc = new jsPDF();
    var col = [["Details", "Values"]];
    var rows = [];

    /* The following array of object as response from the API req  */

    var itemNew = [
      { id: 'Case Number', name: '101111111' },
      { id: 'Patient Name', name: 'UAT DR' },
      { id: 'Hospital Name', name: 'Dr Abcd' }
    ];


    itemNew.forEach(element => {
      var temp = [element.id, element.name];
      rows.push(temp);

    });

    //doc.autoTable(col, rows);
    doc.autoTable({
        head: col,
        body: rows
    });
    doc.save('Test.pdf');
  }

PDF 预览(Test.pdf):

PDF 预览

有关更多信息,请参阅jsPDF-AutoTable 文档


推荐阅读