ANGULAR5:如何将数据导出到csv文件

所以我想实现一个函数,将我在视图上显示的数据转换为csv文件.

更新:这是稍微好一点的方法:

在项目目录中打开命令提示符.

键入'npm install --save file-saver'安装文件保护程序

从'file-saver/FileSaver'导入{saveAs}; 进入你的.ts文件.

这是基于新导入的更新代码.

.

downloadFile(data: any) {
    const replacer = (key, value) => value === null ? '' : value; // specify how you want to handle null values here
    const header = Object.keys(data[0]);
    let csv = data.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','));
    csv.unshift(header.join(','));
    let csvArray = csv.join('\r\n');

    var blob = new Blob([csvArray], {type: 'text/csv' })
    saveAs(blob, "myFile.csv");
}

归功于将对象转换为CSV的答案.

以下是使用方法:

downloadFile(data: any) {
    const replacer = (key, value) => value === null ? '' : value; // specify how you want to handle null values here
    const header = Object.keys(data[0]);
    let csv = data.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','));
    csv.unshift(header.join(','));
    let csvArray = csv.join('\r\n');

    var a = document.createElement('a');
    var blob = new Blob([csvArray], {type: 'text/csv' }),
    url = window.URL.createObjectURL(blob);

    a.href = url;
    a.download = "myFile.csv";
    a.click();
    window.URL.revokeObjectURL(url);
    a.remove();
}

如果我找到了一个更好的方法,我将在后面添加.