重新调整 Ag-Grid 的大小以适应行数

Question

我在 angular 8 应用程序中使用 Ag-Grid。 我试图让网格根据行数调整大小，但也想将网格中的行数限制为 10，然后使用分页显示下一页。

为了将网格中的行数限制为 10，我使用的是 gridHeight = '400px'，它适用于具有 10 行的页面。 但是假设我有 33 行数据，前 3 页各显示 10 行，最后一页显示其余 3 行，最后一页的 gridHeight 仍然为 400px。 有没有办法让它变得动态，以便网格重新调整 3 行的大小。

我知道我们可以使用 domLayout='autoHeight' 但这不适用于 gridHeight。 有什么建议么？

Answer 1

不要使用gridHeight = '400px'将网格中的行数限制为 10，而应使用paginationPageSize属性并将其设置为 10。

就像您在定义网格选项时提到的那样，将domLayout属性定义为“autoHeight”。 只要网格中的记录数量较少，这将自动调整网格高度。

这里有一些代码片段可以帮助你。

  var gridOptions - {
  defaultColdDef : {
  ...
  ...
  },
  --bunch of properties goes here 
  ...
  pagination : true,
  //use pagination page size property to set height instead of using height style.
  paginationPageSize : 10,
  domLayout : 'autoHeight'
  ...
  ...
  }

这是一个工作演示