2

ag-grid 是否可以使用以下格式：

  • 带有空白名称的合并标题
  • 2 行中带有名称的合并标题（“原始值”）
  • 父标题居中（“带有子标题的标题”）

在此处输入图像描述

4

3 回答 3

3

谢谢你，我知道这个问题已经太迟了，但只是为了帮助其他人知道它。

是的，可以使用 ag-grid 的更新版本，请查看。

`var columnDefs = [ {
headerName: 'Athlete Details',
children: [
  {
    headerName: 'Athlete',
    field: 'athlete',
    width: 150,
    suppressSizeToFit: true,
    enableRowGroup: true,
    rowGroupIndex: 0,
  },
  {
    headerName: 'Age',
    field: 'age',
    width: 90,
    minwidth: 75,
    maxWidth: 100,
    enableRowGroup: true,
  }
]

}];

`

https://plnkr.co/edit/?p=preview&preview

于 2021-08-06T14:27:03.247 回答
1

我为此苦苦挣扎了很长一段时间，但我找不到一个好的解决方案。无论如何，我想出了一个解决方案（至少对我自己而言）。

就我而言，标题是动态的。只有一些标题有孩子。

这是解决方案：

  1. 弄清楚标题应该有多少行跨度

在此处输入图像描述

  1. 将类应用于标题

在您的 columnDefs 中，使用“headerClass”

const rowSpanClass = .....  // This is calculated base on the data you have or set it static
columnDefs = { 
   ....
   ....
   headerClass: rowSpanClass, // In my case, if it is 2 rowspan, i call it 'header-row-span-2'
   ......
}

  1. 在自定义标题类上应用样式

    .header-row-span-2 { 位置：固定；顶部：50px；高度：100px；}

    .header-row-span-3 { 位置：固定；顶部：100 像素；
    高度：150px；}

'top' 和 'height' 的值需要相应改变（ag-grid header 高度默认为 50px）

于 2021-09-22T07:56:15.100 回答
0

只是为了分享。我认为使用 ag-grid 中的标题是不可能的。因此，我将 headerheight 设置为 0 并使用行单元格来实现标题格式。

于 2019-01-22T00:13:15.647 回答