angular2导出到excel

时间:2019-02-23 10:41:46

标签: angular angular2-template

我尝试导出到角度更好的excel,但出现错误,例如“无法读取未定义的属性'useBom'。请帮助我解决此错误”

let options = {
      fieldSeparator: ',',
      quoteStrings: '"',
      decimalseparator: '.',
      showLabels: false,
      headers: [],
      showTitle: true,
      title: 'asfasf',
      useBom: true,
      removeNewLines: true,
      keys: ['approved','age','name' ]
    };
   let data = [
      {
        name: "Test, 1",
        age: 13,
        average: 8.2,
        approved: true,
        description: "using 'Content here, content here' "
      }
    ];
  }
<angular2csv [data]="data" filename="test.csv" [options]="options" ></angular2csv>`enter code here`

2 个答案:

答案 0 :(得分:0)

看起来像您的dataoptions不是类字段,而是方法中的一些局部变量(我想)。 看the example。 您应该将dataoptions作为组件类的字段,以便模板可以“看到”它们。

答案 1 :(得分:0)

首先,我们使用papaparse ... enter link description here

import { Papa } from 'ngx-papaparse';
import { exportCsv } from 'app/modules/core/functions/export-csv.function';

exportSummaryCsv() {
    const title = `Story Funnel Summary`;
    const summary = this._columns.map(column => ({
        'Stage': column.name,
        'Quantity': column.items.length
    }));
    const csv = this.csvParser.unparse(summary);
    exportCsv(title, csv);
}

然后我们创建一个blob和一个链接,并将链接插入DOM

export function exportCsv(filename: string, csv: string) {
    filename = `${filename.replace(/ /g, '_')}.csv`;

    const blob = new Blob([csv], {'type': 'text/csv;charset=utf8;'});
    const link = document.createElement('a');

    link.download = filename;
    link.href = URL.createObjectURL(blob);
    link.setAttribute('visibility', 'hidden');

    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
}

然后是触发所有这些操作的按钮...