如何在angular中导出一个csv文件中的多个html表？
如何在angular中导出一个csv文件中的多个html表？
提问于 2021-06-05 14:32:36
我在一个文件中有多个html表。我想把所有的表导出成csv文件。
我使用的是"XLSX“包。
exportAsXLSX() {
let element = document.querySelectorAll('csv-table');
const ws: XLSX.WorkSheet = XLSX.utils.table_to_sheet(element);
const wb: XLSX.WorkBook = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, ws, 'sheet1');
XLSX.writeFile(wb, this.fileName);
}有没有其他方法可以将我所有的表导出到一个csv文件中。
回答 1
Stack Overflow用户
发布于 2021-06-05 15:06:42
在我看来，在这种情况下不需要使用xlsx库。当然，您是基于组件类中的数据模型创建HTML表的。因此，您可以简单地连接来自不同表的数据，并将它们全部写入到一个CSV文件中。
这可以通过以下服务(从koia.io借用的代码)来完成。
import { Injectable } from '@angular/core';
import { DatePipe } from '@angular/common';
import * as FileSaver from 'file-saver';
@Injectable({
providedIn: 'root'
})
export class CSVExportService {
private static readonly TYPE_CSV = 'text/csv;charset=UTF-8';
private newline = '\n';
private datePipe = new DatePipe('en-US');
private timeFormat = 'yyyy-mm-dd_HHmmss';
exportAsCSV(data: Object[], baseFileName: string): void {
const csv = this.toCSV(data, ',');
const blob: Blob = new Blob([csv], { type: CSVExportService.TYPE_CSV });
FileSaver.saveAs(blob, this.generateFileName(baseFileName, '.csv'));
}
private toCSV(data: Object[], delimiter: string): string {
const keys = Object.keys(data[0]);
return keys.join(delimiter) + this.newline +
data.map(e => this.toCSVLine(e, keys, delimiter))
.join(this.newline);
}
private toCSVLine(element: Object, keys: string[], delimiter: string) {
return keys.map(k => element[k])
.join(delimiter);
}
private generateFileName(baseFileName: string, extension: string): string {
const formattedDate = this.datePipe.transform(new Date().getTime(), this.timeFormat);
return baseFileName + '_' + formattedDate + extension;
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67846971
复制相关文章
相似问题
腾讯云开发者
