Question

我目前正在使用带有角度6的ag-grid导出到excel功能，其中包含50,000行大数据？

当我的数据少于1000条时，我可以轻松下载文件（<1秒），但是当数据增加到50000行时，我的Web浏览器变得无响应，并且出现了chrome错误“出现了某些错误“ 过了一会儿。我的代码是

onBtExport() {
var params = {
    suppressTextAsCDATA: true,
    allColumns:true,
    onlySelected: false,
    fileName:this.elementRef.nativeElement.querySelector('#fileName').value,
    sheetName: 
    this.elementRef.nativeElement.querySelector('#sheetName').value
};
//this.gridApi.exportDataAsExcel(params);
var content = this.gridApi.getDataAsExcel(params);
var workbook = XLSX.read(content, {type: 'binary'});
var xlsxContent = XLSX.write(workbook, {bookType: 'xlsx', type: 'base64'});
download(params, xlsxContent);
}

使用约1000行的网格数据，这绝对可以正常工作，我能够在大约1秒钟的时间内在浏览器中下载文件，但是当数据增加到50000行时，我的浏览器将变得无响应。

Answer 1

您可以通过多种选择来解决此问题： 1）下载尽可能多的行，然后下载第二部分，第三部分...依此类推您可以通过exportDataAsExcel（params）执行此操作，其中params实现BaseExportParams 例如，其中有几个字段，您可以使用onlySelected。 2）更方便的方法是不使用ag-grid api创建后端服务。

Answer 2

如果大小超出chrome，则AG-Grid中的数据将存储在内存中，这将引发内存不足错误。通过Ag-Grid导出50,000多个数据时，我遇到了类似的问题，这会使少数用户的浏览器崩溃。以下是可以考虑的几件事

不是使用网格API方法，而是创建服务器端方法来导出大数据
CSV导出比Excel导出要快，但是您不会获得格式

尝试下面的代码，我正在使用该代码，但并非100％完整的证据，但有助于通知用户后台发生了某些操作

 $scope.onBtExportXls = function () {$scope.agGridOptions.api.showLoadingOverlay();

setTimeout(function () {

content = this.gridOptions.api.getDataAsExcel(xlsExcelParams);

var blobObject = new Blob(["\ufeff", content], {
        type: "text/csv;charset=utf-8;"
    });

if (window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(blobObject, fileName);
}
else {
    // Chrome
    var downloadLink = document.createElement("a");
    downloadLink.href = window.URL.createObjectURL(blobObject);
    downloadLink.download = fileName;
    document.body.appendChild(downloadLink);
    downloadLink.click();
    document.body.removeChild(downloadLink);
}      
$scope.agGridOptions.api.hideOverlay();
}, 50);};

如何使用ag-grid导出到具有Angular 6（内存不足错误）的大数据（50,000行）的excel功能？

2 个答案: