私はag-Gridでサーバーサイドページネーションを行いたいと思います。私はグリッドを正常に実装し、初めてページが読み込まれたときに特定のデータを表示しました。私のテーブルには5000以上のレコードがあり、次のボタンを押すたびにグリッド内の次のレコードを取得するためにサーバーを呼び出す必要があります。しかし、別のHTTP要求を行うためにページングイベントを聴く方法はわかりません。私のサーバーは、次/前のボタンをクリックするとヒットしません。ag-Gridサーバーサイドページングイベント
マイ・グリッド・オプション:
this.gridOptions = <GridOptions>{};
this.gridOptions = {
enableServerSideSorting: true,
enableServerSideFilter: true,
enableSorting: true,
enableFilter: true,
enableColResize: true,
rowSelection: 'single',
rowDeselection: true,
columnDefs: this.columnDefs,
rowModelType: 'infinite',
paginationPageSize: 35,
maxConcurrentDatasourceRequests: 2,
infiniteInitialRowCount: 1,
getRowNodeId: (item: any) => {
return item.id;
},
pagination: true,
onGridReady:() => { this.gridOptions.api.sizeColumnsToFit(); },
context: { componentParent: this },//to invoke the method of this(parent) component from child component,
onRowClicked: (event: any) => { this.router.navigateByUrl(`/dataList/edit/${event.data.id}`); },
};
データソースdefination:
let dataSource = {
getRows: (params: any) => {
setTimeout(() => {
let dataAfterSortingAndFiltering = this.sortAndFilter(allOfTheData, params.sortModel, params.filterModel);
let rowsThisPage = dataAfterSortingAndFiltering.slice(params.startRow, params.endRow);
// if on or after the last page, work out the last row.
let lastRow = -1;
if (dataAfterSortingAndFiltering.length <= params.endRow) {
lastRow = dataAfterSortingAndFiltering.length;
}
params.successCallback(rowsThisPage, lastRow);
}, 500);
}
};
this.gridOptions.api.setDatasource(dataSource);