Question

我正在使用Ag-grid和分页。

我正在寻找一种方法，使用 count / pageSize 方式设置分页的总页数。

应在事件 onPaginationChanged

上加载数据

类似的东西：

git checkout -b B

Answer 1

没有直接的api /参数来设置页数。但您可以更改paginationPageSize以确保最多有10页

假设您每页最少50个。

var gridOptions = {
   ...
   pagination: true,
   paginationPageSize: 50,
   ...
};

然后你可能有一些设置数据的方法

setDataToGrid: function(data){
    //data is more than your what can be fit in 10 pages
    if(data.length > gridOptions.paginationPageSize * 10){
        gridOptions.paginationPageSize = Math.ceil(data.length/10);
    }
    gridOptions.api.setRowData(data);
}

working plnkr example here

注意：总是分发到十个页面并不好，除非你有大量的行无法显示。

Answer 2

Vue js中的示例首先添加：-

 <v-select
              v-bind:items="pageSize"
              v-model="pageModel"
              label="PageSize"
              v-on:change="onPageSizeChanged(pageModel)"
              id="page-size"
              style="width:115px;max-height: 32px;text-align:right !important;  
              float: right;
              margin-right: 283px;
              margin-top:10px;"

            ></v-select>

然后添加方法

/ **使用页面大小设置分页* /

 onPageSizeChanged(newPageSize) {
      this.gridApi.paginationSetPageSize(parseInt(newPageSize));
    },

Answer 3

我可以通过将total number of pages行模型与rowModelType: infinite一起使用来在ag-grid中设置pagination: true，以达到相同的效果：

请参见以下示例：https://www.ag-grid.com/javascript-grid-infinite-scrolling/#example-block-equal-page

此处的关键是将lastRow设置为等于从服务器获取的页面总数，并将其传递到params.successCallback(rowsThisPage, lastRow);，这样ag-grid会提前知道页面总数并显示总数分页控制中的计数。


    const dataSource = {
        rowCount: null,
        getRows: function(params) {
          console.log(
            'asking for ' + params.startRow + ' to ' + params.endRow
          );
          let pageNum = Math.round(params.endRow / PAGE_SIZE);
          fetchPage(pageNum).then(page => {
            var rowsThisPage = page.entities;
            var lastRow = page.paging.totalCount;
            params.successCallback(rowsThisPage, lastRow);
          });
        }
    };
    params.api.setDatasource(dataSource);
  }

在Ag-grid分页中设置totalPages

3 个答案: