我有一个包含大量列定义的uigrid,这些列定义最初没有填充数据,因为数据集太大了。相反,当列可见性发生变化时,我会收到请求的列数据。
这会导致内置csv导出器出现问题。当有人选择“将所有数据导出为csv”时,会得到许多空列。
所以我按照以下方式制作了自己的实现:
$interval( function() {
gridApi.core.addToGridMenu( gridApi.grid, [{
title: 'Export All to CSV',
order: 1,
action: function ($event) {
var myElement = angular.element(document.querySelectorAll(".custom-csv-link-location"));
$scope.gridApi.exporter.csvExport( uiGridExporterConstants.ALL, uiGridExporterConstants.VISIBLE, myElement );
}
}]);
gridApi.core.addToGridMenu( gridApi.grid, [{
title: 'Export Selected to CSV',
order: 2,
action: function ($event) {
if(gridApi.grid.selection.selectedCount > 0){
var myElement = angular.element(document.querySelectorAll(".custom-csv-link-location"));
$scope.gridApi.exporter.csvExport( uiGridExporterConstants.SELECTED, uiGridExporterConstants.VISIBLE, myElement );
}
}
}]);
gridApi.core.addToGridMenu( gridApi.grid, [{
title: 'Export Visible to CSV',
order: 3,
action: function ($event) {
var myElement = angular.element(document.querySelectorAll(".custom-csv-link-location"));
$scope.gridApi.exporter.csvExport( uiGridExporterConstants.VISIBLE, uiGridExporterConstants.VISIBLE, myElement );
}
}]);
}, 0, 1);
全部导出到CSV并导出可见到CSV按预期工作,但导出选定只创建一个只包含标题但没有数据的CSV文件。
我知道网格知道选择,下面将选择的元素返回到控制台:
gridApi.core.addToGridMenu( gridApi.grid, [{
title: 'Export Selected to CSV',
order: 2,
action: function ($event) {
if(gridApi.grid.selection.selectedCount > 0){
var myElement = angular.element(document.querySelectorAll(".custom-csv-link-location"));
$scope.gridApi.exporter.csvExport( uiGridExporterConstants.SELECTED, uiGridExporterConstants.VISIBLE, myElement );
console.log(gridApi.selection.getSelectedRows());
gridApi.selection.getSelectedRows().forEach(function (entry) {
console.log(entry);
for (var e in entry){
console.log(entry[e]);
}
});
}
}
}]);
我想我可以使用getSelectedRows返回的数据制作我自己的CSV,但我宁愿不这样做。 uiGridExporterConstants.SELECTED坏了吗?
答案 0 :(得分:0)
我使用公共API和我自己的一些黑客“修复”它:
gridApi.core.addToGridMenu( gridApi.grid, [{
title: 'Export Selected to CSV',
order: 2,
action: function ($event) {
if(gridApi.grid.selection.selectedCount > 0){
var uiExporter = uiGridExporterService;
var grid = $scope.gridApi.grid;
uiExporter.loadAllDataIfNeeded(grid, uiGridExporterConstants.ALL, uiGridExporterConstants.VISIBLE).then(function() {
var exportColumnHeaders = uiExporter.getColumnHeaders(grid, uiGridExporterConstants.VISIBLE);
var selectionData = [];
gridApi.selection.getSelectedRows().forEach(function (entry) {
var innerData = [];
for (var e in entry){
if (e !== '$$hashKey') {
var selectObj = {value:entry[e]};
innerData.push(selectObj);
}
}
selectionData.push(innerData);
});
var csvContent = uiExporter.formatAsCsv(exportColumnHeaders, selectionData, grid.options.exporterCsvColumnSeparator);
uiExporter.downloadFile($scope.gridOptions.exporterCsvFilename, csvContent, grid.options.exporterOlderExcelCompatibility);
});
}
}
}]);
不是最漂亮的解决方案,但它确实有效。