ag-grid上更改页面和缓存块的大小会导致项目的无限加载

Question

我希望使用ag-grid的“服务器端”模式为每个页面重新获取数据。为了做到这一点，我使maxBlocksInCache 1和cacheBlockSize等于每页项目。到这里为止一切正常。

现在，当我更改每页的项目数时，网格将通过获取数据开始在其自身上循环。我假设这是因为cacheBlockSize不可更改，或者在对行进行重新尝试（永远不会完成）之后发生更改。

现在我已经尝试将缓存作为输入而不是agGridOption进行输入，但是它什么也没有改变。

<select #paginationSelect (change)="onPageSizeChanged(paginationSelect.value)" [(ngModel)]="itemsPerPage">
    <option [value]="item">2</option>
    <option [value]="item">10</option>
</select>
<ag-grid-angular
        [gridOptions]="gridOptions"
        [cacheBlockSize]="itemsPerPage"
        style="width: 100%; height: 250px;">
</ag-grid-angular>

this.gridOptions = {
            ...
            rowModelType: 'serverSide',
            pagination: true,
            paginationPageSize: this.itemsPerPage, // itemsPerPage is a class attribute attached to a select element using ngModel.
            maxBlocksInCache: 1,
            ...
}

// function called on change of select element value representing the number of items to display per page
onPageSizeChanged(newPageSize) {
        this.gridApi.paginationSetPageSize(newPageSize);
    }

我希望能够动态地更改页面项目的大小，同时保持页面上数据的重新获取。

Answer 1

要更改cacheBlockSize，请使用私有gridApi成员gridOptionsWrapper：

onPageSizeChanged(newPageSize) {
      this.gridApi.paginationSetPageSize(newPageSize);
      const api: any = this.gridApi;
      api.gridOptionsWrapper.setProperty('cacheBlockSize', Number(newPageSize));
    }