如何在 angular js ui Grid 中删除 pdf 导出中的某些列

Question

我正在使用 Angular JS ui 网格

http://ui-grid.info/docs/#/tutorial/312_exporting_data_complex

我的要求ui我想展示例如5 列，但是当我导出 PDF 时，我不想导出某些列，例如 username.

我该怎么做？

Answer 1

有一个 gridOption 可以做到这一点：exporterSuppressColumns

我编辑了 UI 网格文档中的 plunker，以演示在导出的 PDF 中隐藏 "Gender" 列： http://plnkr.co/edit/89ZVlPZcQbHYzgX5l4yq?p=preview

现在无论您 select 导出 "all" 还是导出 "visible"，您都不会在输出中看到性别列。

  $scope.gridOptions = {
columnDefs: [
  { field: 'name',visible:true },
  { field: 'gender', cellFilter: 'mapGender', exporterPdfAlign: 'right', visible:true, enableHiding: true },
  { field: 'company', visible: false }
],
exporterSuppressColumns: [ 'gender' ],

文档在这里：http://ui-grid.info/docs/#/api/ui.grid.exporter.api:GridOptions

Answer 2

exporterSuppressExport: true

示例

{
 name: 'Description', enableCellEdit: true,
 cellTemplate: '<div class="ui-grid-cell-contents"><div ng-class="{\'viewr-dirty\' : row.inlineEdit.entity[col.field].isValueChanged }">{{row.entity[col.field]}}</div></div>'
},

查看此处了解更多信息http://ui-grid.info/docs/#/api/ui.grid.exporter.api:ColumnDef

Answer 3

现在这是一个包含按钮的列，需要从导出中排除

{
    name: null,
    exporterSuppressExport: true, // <--- Here
    field: "fake",
    cellTemplate: '<div class="tac"><a class="btn btn-red btn-xs ml5" ng-if="!row.inlineEdit.isEditModeOn" ng-click="grid.appScope.vm.deleteRow(row, $event)"><i class="fa fa-trash"><md-tooltip md-direction="left">delete</md-tooltip></i></a></div>',
    enableCellEdit: false,
    enableFiltering: false,
    enableSorting: false,
    showSortMenu: false,
    enableColumnMenu: false,
    width: 50,
},

Answer 4

您也可以像这样将选项 exporterSuppressExport: true 添加到 columnDefs 中的所需列：

$scope.gridOptions = {
  columnDefs: [
    { field: 'username', exporterSuppressExport: true },
    { field: 'someOtherField' }
  ],
  // other options ...
};

现在只有 someOtherField导出。

如何在 angular js ui Grid 中删除 pdf 导出中的某些列

How can I remove some columns in pdf export in angular js ui Grid

javascript

angularjs

ng-grid

angular-ui-grid

pdfmake