Angular ui-grid外部导出按钮

Question

我正在使用Angular UI-GRID,我需要为PDF导出和CSV导出等导出功能创建外部按钮,类似于此图像.你知道我怎么能这样做吗？

此外,我需要一个打印按钮,但我没有在文档中看到它.此网格是否有打印行为？

谢谢你,埃内斯托

Answer 1

看一下ui-grid.exporter源代码(这将专门解决pdf导出,从〜第972行开始,但你也可以将它应用到csv用例),你可能想要创建一个外部按钮你的HTML,然后扎uiGridExporterService的pdfExport()功能,通过该按钮ng-click.根据代码,该pdfExport函数采用三个参数:grid,rowTypes和colTypes.要获得网格对象,用途$scope.gridApi.grid,你需要设置为常数后两者- uiGridExporterConstants.ALL,uiGridExporterConstants.SELECTED或uiGridExporterConstants.VISIBLE-取决于你想要导出的内容.确保注入uiGridExporterService并uiGridExporterConstants进入模块.

看看我从ui-grid docs改编的这个plunker.相关位:

<div ui-grid="gridOptions" ui-grid-selection ui-grid-exporter class="grid"></div>
<button ng-click="exportPdf()">PDF</button>

$scope.exportPdf = function() {
  var grid = $scope.gridApi.grid;
  var rowTypes = uiGridExporterConstants.ALL;
  var colTypes = uiGridExporterConstants.ALL;
  uiGridExporterService.pdfExport(grid, rowTypes, colTypes);
};

希望有所帮助!