如何从 ag-grid 中的 defaultColDef 减少过滤器选项？

Question

我正在尝试将 AG-Grid 合并到我的 Angular 应用程序中。我正在使用 defaultColDef，它提供了很多过滤器选项，即：包含、不包含、开始于、结束于、等于和不等于。我只需要三个开头，等于和包含。

<div *ngIf="tableOption">
  <ag-grid-angular class="ag-theme-alpine" id="ag-grid" 
    [pagination]="true" 
    paginationPageSize=10 
    [rowData]="rowData" 
    domLayout='autoHeight' 
    [columnDefs]="ColumnHeader" 
    [defaultColDef]="defaultColDef" 
    [enableRangeSelection]="true" 
    [rowSelection]="rowSelection" 
    [rowGroupPanelShow]="rowGroupPanelShow" 
    [pivotPanelShow]="pivotPanelShow">
  </ag-grid-angular>
</div>

我尝试在我的组件中设置过滤器选项，但它没有生效。

 public columnTitles = [{
     field: 'importance',
     maxWidth: 120,
     valueGetter: 'node.Importance',
     cellRenderer: 'loadingCellRenderer',
     sortable: true,
     suppressMenu: true,
     filter: 'ImportanceFilter',
     filterParams: {
       filterOptions: ['equals', 'contains', 'startsWith']
     }
   }
   //,...
 ];

 constructor(
   private route: ActivatedRoute,
   private singleUrlService: SingleUrlService,
   private formBuilder: FormBuilder) {
   this.defaultColDef = {
     enableRowGroup: true,
     enablePivot: true,
     enableValue: true,
     sortable: true,
     resizable: true,
     flex: 1,
     minWidth: 150,
     filter: true,
     enableRangeSelection: true,
     pagination: true,
     filterOptions: ['equals', 'contains', 'startWith']
   };
 }

Answer 1

您在defaultColDef 对象上设置filterOptions，而您需要在defaultColDef 上设置filterParams。请尝试以下操作：

this.defaultColDef = {
  enableRowGroup: true,
  enablePivot: true,
  enableValue: true,
  sortable: true,
  resizable: true,
  flex: 1,
  minWidth: 150,
  filter: true,
  enableRangeSelection: true,
  pagination: true,
  filterParams: {
      filterOptions: ['equals', 'contains', 'startWith']
    }
};