Question

我有一个如下的ui-grid选项

      {  
   "enableHorizontalScrollbar":false,
   "enableHiding":false,
   "enableColumnResizing":true,
   "enableSorting":true,
   "enableColumnResize":true,
   "paginationPageSize":20,
   "enablePagination":true,
   "enablePaginationControls":true,
   "columnDefs":[  
      // skipped for clarity
   ],
   "data":"griddata",
   "excludeProperties":[  
      "$$hashKey"
   ],
   "enableRowHashing":true,
   "showHeader":true,
   "headerRowHeight":30,
   "rowHeight":30,
   "maxVisibleRowCount":200,
   "minRowsToShow":10,
   "showFooter":false,
   "footerRowHeight":30,
   "columnWidth":50,
   "maxVisibleColumnCount":200,
   "virtualizationThreshold":20,
   "columnVirtualizationThreshold":10,
   "excessRows":4,
   "scrollThreshold":4,
   "excessColumns":4,
   "horizontalScrollThreshold":2,
   "scrollThrottle":70,
   "enableFiltering":false,
   "enableColumnMenus":true,
   "enableVerticalScrollbar":1,
   "minimumColumnSize":10,
   "headerTemplate":null,
   "footerTemplate":null,
   "cellEditableCondition":true,
   "enableCellEditOnFocus":false
}

所以我希望会发生一些分页，但事实并非如此。我看到了卷轴。可能是什么原因？

我的目标是客户端分页。

Answer 1

您必须将指令添加到网格中：

<div ui-grid="grid" ui-grid-pagination class="grid"></div>

并将ui.grid.pagination添加到您的模块依赖项中。

Answer 2

Your HTML may be like this:

<div class="grid" ui-grid="gridOptions" ui-grid-pagination></div>

And your ui-grid options:

$scope.gridOptions = {
    //all your code
  };

Answer 3

有时，人们可能忘记在app.js中添加'ui.grid.pagination'模块。检查你的app.js，如果你也忘了添加，添加它就可以了。

角 - ui - 网格分页缺失

3 个答案: