angularjs - 在 Angular UI Grid 中导出为 CSV 时更改文件名

Question

我们在项目中使用 Angular UI Grid。我需要使用导出的 CSV 数据将当前日期放在文件名中。
我现在在“导出”按钮上做的事情:

$scope.exportCSV = function () {
     $scope.gridOptions.exporterCsvFilename = getDate() + ".csv";
     $scope.gridApi.exporter.csvExport("all", "visible");
};

问题是文件名只配置一次，在下次点击时不会改变。如何重新设置文件名？

Answer 1

要动态更改文件名，您需要注入(inject) uiGridExporterService 服务，然后您可以调用下载文件接受文件名作为第一个参数的函数。

例子:

var app = angular.module('app', ['ngAnimate', 'ui.grid', 'ui.grid.selection', 'ui.grid.exporter']);

app.controller('MainCtrl', ['$scope','uiGridExporterConstants','uiGridExporterService', function ($scope,uiGridExporterConstants,uiGridExporterService) {

  $scope.exportCSV = function(){
     var exportService=uiGridExporterService;
     var grid=$scope.gridApi.grid;
     var fileName=getDate() + ".csv";

     exportService.loadAllDataIfNeeded(grid, uiGridExporterConstants.ALL, uiGridExporterConstants.VISIBLE).then(function() {
     var exportColumnHeaders = exportService.getColumnHeaders(grid, uiGridExporterConstants.VISIBLE);
     var exportData = exportService.getData(grid, uiGridExporterConstants.ALL, uiGridExporterConstants.VISIBLE);
     var csvContent = exportService.formatAsCsv(exportColumnHeaders, exportData, grid.options.exporterCsvColumnSeparator);
         exportService.downloadFile(fileName, csvContent, grid.options.exporterOlderExcelCompatibility);
  });

}
}]);

实时示例: http://plnkr.co/edit/O44fbDiCe6Pb5vNYRVSU?p=preview