angular - Infinite scroll keeps loading empty data from server even after last row is reached

Question

I am working on Ag grid with server side pagination along with infinite scroll.

I have implemented it, but with a problem. Even after the last row is reached, the grid keeps calling the server for data and also it keeps adding blank pages in the grid.

Below is the code:

 var datasource = {
     let page=0;
     let lastRow = 1200;
            getRows: (params: IGetRowsParams) => {
              this.info = "Getting datasource rows, start: " + params.startRow + ", end: " + params.endRow;

              this.api.getRowData(page+1)
                        .subscribe(data => params.successCallback(data,lastRow));

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

    } 

I followed below example to implement it: https://stackblitz.com/edit/ag-grid-infinite-scroll-example

标签： angularag-gridinfinite-scroll

Answer 1

您在 中缺少params.endRow参数params.successCallback(data)。函数的第二个参数successCallback告诉网格分页何时结束。

onGridReady(params: any) {
    console.log("onGridReady");
    var datasource = {
        getRows: (params: IGetRowsParams) = > {
            this.info = "Getting datasource rows, start: " + params.startRow + ", end: " + params.endRow;
            this.getRowData(params.startRow, params.endRow)
                .subscribe(data = > params.successCallback(data, params.endRow));
        }
    };