ag-grid api支持列过滤下拉列表

Question

在数据表中，它支持单个列搜索（选择输入）。 (datatable)。通过键入，ag-grid除了过滤器列之外还支持类似的功能。

Answer 1

据我所知，ag-grid不支持“开箱即用”。在免费版本中，仅支持“数字”和“文本”类型的过滤。在付费的企业版中，还有一个类型为“set”的过滤器，但只有多个选择。但是，可以编写自定义过滤器。示例显示在“自定义列过滤”子章节Link to the custom ag-grid filters

下

P.S。想发表评论，因为实际上这不是一个真正的答案，但没有足够的回购。

Answer 2

是ag ag grid有一个api gridOptions.api.setQuickFilter但是它将在整个网格中应用

Answer 3

    import { Component } from '@angular/core';
import { AgFloatingFilterComponent } from 'ag-grid-angular';
import { IFloatingFilterParams } from 'ag-grid-community';

@Component({
  selector: 'number-component',
  template: `<select
      style="width: 100%"
      [(ngModel)]="currentValue"
      (ngModelChange)="onChange()"
    >
    <option value=""></option>
    <option *ngFor="let c of options" [ngValue]="c">{{c}}</option>
    </select>`,
})
export class OptionFilterComponent
  implements AgFloatingFilterComponent {
  params: IFloatingFilterParams | undefined;
  currentValue: Number | null | string = null;
  style: any;
  options: any;

  agInit(params: any): void {
    this.params = params;
    this.options = params.options;
  }

  onParentModelChanged(parentModel: any) {
    // When the filter is empty we will receive a null value here
    if (!parentModel) {
      this.currentValue = null;
    } else {
      this.currentValue = parentModel.filter;
    }
  }

  onChange() {
    if (!!!this.currentValue) {
      // Remove the filter
      this.params?.parentFilterInstance((instance: any) => {
        instance.onFloatingFilterChanged(null, null);
      });
      return;
    }
    this.params?.parentFilterInstance((instance: any) => {
      instance.onFloatingFilterChanged('equals', this.currentValue);
    });
  }
}