将数据导出到角度打字稿中的csv文件

Question

我正在尝试将一些数据导出到CSV文件.我有它在chrome工作但在IE11中我被重定向到另一个页面,其中blob数据作为url.

我已经过滤了一个名为this.filteredReviews的类数组下要导出的数据.我有一个调用downloadButtonPush函数的按钮.我正在隐藏的主体末端创建一个锚标记,并在创建后单击自己以下载csv数据.以下是我的代码.

downloadButtonPush() {
    var csvData = this.ConvertToCSV(this.filteredReviews);
    var a = document.createElement("a");
    a.setAttribute('style', 'display:none;');
    document.body.appendChild(a);
    var blob = new Blob([csvData], { type: 'text/csv' });
    var url = window.URL.createObjectURL(blob);
    a.href = url;
    a.download = 'ETPHoldReview.csv';
    a.click();
}
ConvertToCSV(objArray: any): string {
    var array = typeof objArray != 'object' ? JSON.parse(objArray) : objArray;
    var str = '';
    var row = "";

    for (var index in objArray[0]) {
        //Now convert each value to string and comma-separated
        row += index + ',';
    }
    row = row.slice(0, -1);
    //append Label row with line break
    str += row + '\r\n';

    for (var i = 0; i < array.length; i++) {
        var line = '';
        for (var index in array[i]) {
            if (line != '') line += ','

            line += array[i][index];
        }
        str += line + '\r\n';
    }
    return str;
}

在chrome中,数据导出正常但在IE中而不是打开文件下载管理器,我被重定向到一个新页面,其中包含以下URL地址.

BLOB:6F807758-B267-4F51-8B6F-0CFDAFE68B78

有谁知道为什么这个代码不能在IE中工作或知道是否有更简单的方法将json导出到角度的csv？

Answer 1

你必须为IE做一个特例(想象一下).它使用msSaveBlob或msSaveOrOpenBlob函数.尝试重写你的downloadButtonPush()函数

downloadButtonPush() {
  var csvData = this.ConvertToCSV(this.filteredReviews);
  var blob = new Blob([csvData], { type: 'text/csv' });
  var url = window.URL.createObjectURL(blob);

  if(navigator.msSaveOrOpenBlob) {
    navigator.msSaveBlob(blob, filename);
  } else {
    var a = document.createElement("a");
    a.href = url;
    a.download = 'ETPHoldReview.csv';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
  }
  window.URL.revokeObjectURL(url);
}

我前一段时间遇到了同样的问题,并且PierreDuc 从这个答案中获取了大部分内容