Angular Ag网格：如何实现过滤和；排序服务器端数据？

我反复阅读文档，但没有找到一个关于这种基本特性的单词

以下是我到目前为止得到的信息：

  ngOnInit() {
    this.rowData = this.paymentMethodService.getPaymentMethods({});
  }

从Observable获取数据，注意空的

{}

，这是我希望传递过滤器、排序、分页信息的地方

这是一个定义的过滤器

{ headerName: 'Name', field: 'name' , sortable: true, filter: 'agTextColumnFilter' }

---

筛选器仅应用于最初显示的行，而我需要将其数据路径发送到服务器。

您需要向API发送有关

筛选器和
排序的信息。这是一个粗略的例子：

<ag-grid-angular 
     style="width: 100%; height: 100%" 
     class="ag-theme-balham"
     [gridOptions]="gridOptions"
     [columnDefs]="yourColumns"
     (gridReady)="onGridReady($event)"
     #grid
></ag-grid-angular>



打字稿：

public yourColumns: any[];
public rowData: any[];
public gridOptions: any;

@ViewChild('grid') grid: AgGridNg2;

this.yourColumns= [
      { headerName: 'One', field: 'one' },
      { headerName: 'Two', field: 'two' },
      { headerName: 'Three', field: 'three' }
    ];

this.gridOptions = {
  rowSelection: 'single',
  cacheBlockSize: 100,
  maxBlocksInCache: 2,
  enableServerSideFilter: false,
  enableServerSideSorting: false,
  rowModelType: 'infinite',
  pagination: true, 
  paginationAutoPageSize: true
};

 private getRowData(startRow: number, endRow: number): Observable<any[]> {
  //this code is included only for example. You need to move it to 
  //service
  let params: HttpParams = new HttpParams()
      .append('startRow', `${startRow}`)
      .append('endRow', `${endRow}`);

  return this.http.get(`${this.actionUrl}/GetAll`, {params: params})
      .pipe(
          map((res: any) => res.data)
      );
}

onGridReady(params: any) {
  console.log("onGridReady");
  var datasource = {
    getRows: (params: IGetRowsParams) => {
      this.getRowData(params.startRow, params.endRow)
                .subscribe(data => params.successCallback(data));

    }
  };
  params.api.setDatasource(datasource);

}

public列：任意[]；
公共数据：任何[]；
公共选择：任何；
@ViewChild（“网格”）网格：AgGridNg2；
此.yourColumns=[
{headerName:'One'，field:'One'}，
{headerName:'Two'，field:'Two'}，
{headerName:'Three'，field:'Three'}
];
this.gridOptions={
行选择：“单个”，
缓存块大小：100，
maxBlocksInCache:2，
enableServerSideFilter:false，
enableServerSideSorting:false，
rowModelType:'无限'，
分页：正确，
分页自动页面大小：true
};
私有getRowData（startRow:number，endRow:number）：可观察{
//此代码仅包含在示例中。您需要将其移动到
//服务
let-params:HttpParams=new-HttpParams（）
.append（'startRow'，`${startRow}`）
.append（'endRow'，`${endRow}`）；
返回this.http.get（`${this.actionUrl}/GetAll`，{params:params}）
.烟斗(
映射（（res:any）=>res.data）
);
}
onGridReady（参数：任何）{
控制台日志（“onGridReady”）；
变量数据源={
getRows：（参数：IGetRowsParams）=>{
this.getRowData（params.startRow、params.endRow）
.subscribe（数据=>params.successCallback（数据））；
}
};
params.api.setDatasource（数据源）；
}