如何使用样式和格式在angular 4应用程序中实现导出数据到excel功能?

时间:2017-12-01 12:27:11

标签: excel angular typescript webpack export-to-excel

我们使用Swimlane-ngxtable显示数据。
我想将数据导出到excel。

我尝试过以下代码:

private wrapAndCenterCell(range: XLSX.Range, worksheet: XLSX.WorkSheet) {
const wrapAndCenterCellStyle = {
    alignment: { wrapText: true, vertical: 'center', horizontal: 'center' },
    font: { bold: true, color: 'red' }
};

for (var R = range.s.r; R <= range.e.r; ++R) {
    for (var C = range.s.c; C <= range.e.c; ++C) {
        var cell_address = { c: C, r: R };
        var cell_ref = worksheet[XLSX.utils.encode_cell(cell_address)];
        this.setCellStyle(cell_ref, wrapAndCenterCellStyle);
        }
    }

}

private setCellStyle(cell: XLSX.CellObject, style: {}) {
    cell.s = style;
}

private saveAsExcelFile(buffer: any, fileName: string): void {
    const data: Blob = new Blob([buffer], {
        type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8"
    });
    FileSaver.saveAs(data, fileName + '_export_' + new Date().getTime() + ".xlsx");
}

我可以导出数据但不应用格式。

我想知道优化的方法。

1 个答案:

答案 0 :(得分:2)

如果要将数据导出到项目中的excel文件,请按照此说明进行操作。

1.添加文件保护程序和xlsx依赖项

table td {
  word-wrap: break-word;
  overflow-wrap: break-word;
  max-width: 100px;
  min-width: 50px;
  display:block;
  display:inline-block;
}

2.Implement ExcelService

npm install file-saver --save
npm install xlsx --save
相关问题