AG-Grid:将子列定义添加到行组

时间:2019-08-05 16:25:11

标签: angular typescript ag-grid

我正在尝试将子列定义添加到行组。会生成如下视图的内容:enter image description here

我数组中的每个对象看起来都像这样:

// using the s1c1 format to help show where the data is supposed 
// to appear on the grid/table; actual property names are different.
{
    date: '12/03/2019', // sub row grouping
    monthYear: 'December 2019', // first row grouping

    s1c1: 1,
    s1c2: 5,
    s1c3: 4,

    s2c1: 2,
    s2c2: 6,
    s3c3: 0,

    s3c1: 1,
    s3c2: 5,
    s3c3: 4,

    s4c1: 2,
    s4c2: 6,
    s4c3: 0,
}

我的列定义为:

[
    {
        headerName: '',
        field: 'monthYear',
        rowGroup: true,
        hide: true
    },
    {
      headerName: 'h1',
      headerClass: 'lines',
      cellClass: 'lines',
      children: [
        {
            headerName: 'h1 c1',
            field: 'h1c1',
            headerClass: 'lines',
            cellClass: 'lines',
        },
        {
            headerName: 'h1 c2',
            field: 'h1c2',
            headerClass: 'lines',
            cellClass: 'lines',
          },
      ]
    },
    {
      headerName: 'h2',
      headerClass: 'lines',
      cellClass: 'lines',
      children: [
      {
          headerName: 'h2 c1',
          field: 'h2c1',
          headerClass: 'lines',
          cellClass: 'lines',
      },
      {
          headerName: 'h2 c2',
          field: 'h2c2',
          headerClass: 'lines',
          cellClass: 'lines',
        },
      ]
    }
]

//

{
  headerName: 'Period',
  field: 'monthYear',
  cellRenderer: 'agGroupCellRenderer',
  cellRendererParams: {
    suppressCount: true
  },
  minWidth: 200,
  maxWidth: 200
}

我只是无法使用ag-grid配置子标题。按日期分组的每一行将在其中包含这四个子标题。这是基于我得到的线框(可能必须重新设计)。

有什么想法吗?

谢谢。

0 个答案:

没有答案