如何在Ag网格中显示不同的列数据作为工具提示？

Question

var ColDef = [{
    headerName: "colA",
    field: 'colA',
    rowGroup: true
  },
  {
    headerName: "colB",
    field: 'colB',
    pivot: true,
    enablePivot: true
  },
  {
    headerName: "colC",
    field: 'colC',
    rowGroup: true
  },
  {
    field: 'colD',
    aggFunc: 'first',
    valueFormatter: currencyFormatter,
    tooltip: function(params) {
      return (params.valueFormatted);
    },
  },
  {
    field: 'comment'
  },
  {
    field: 'colF'
  }
];
function currencyFormatter(params) {
  return params.value;
}

以上代码来自不同的问题。它有效，但我想使用不同的注释字段作为当前colD的工具提示，这是一个枢轴值，这也是一个组和枢轴agGrid，如果是普通网格，这不是问题。我希望对组和透视agGrid有任何想法吗？

Answer 1

不确定在这种情况下网格是否有很好的方法来获取数据，因为数据透视后行和列与原始模型不同。

也许您可以考虑在网格之外检索此信息。假设您还希望在工具提示中显示一些汇总信息，则工具提示功能最终可能看起来像这样：

tooltip: params => {            
            const country = params.node.key;
            const year = params.colDef.pivotKeys[0];            
            const athletesWithNumbers = this.state.rowData
            .filter(d => d.year == year)
            .filter(d => d.country === country)
            .filter(d => d.gold > 0)
            .map(d => d.athlete + ': ' + d.gold);
            return athletesWithNumbers.join(', ');
          }

再说一次，请参阅this plunker-不确定这是否是您想要的，只是一个仅供参考。

Answer 2

仅使用tooltipValueGetter

{
   field: 'message',
   headerName: 'Message',
   headerTooltip: 'Message',
   width: 110,
   filter: 'agSetColumnFilter',
   tooltipValueGetter: (params) =>  `${params.value} some text`
}

或仅对tooltipValueGetter使用相同的方法

UPDATE：

好，我知道

但也很容易

Ag-grid具有属性tooltipField-您可以在其中从网格中选择任何字段

例如，在这里-在“运动”列中，我正在显示上一列的工具提示

示例：https://plnkr.co/edit/zNbMPT5HOB9yqI08

OR

您可以按tooltipValueGetter轻松处理每个字段的数据与下一个建筑：

tooltipValueGetter: function(params) {  
  return `Country: ${params.data.country}, Athlete: ${params.data.athlete}, Sport: ${params.data.sport}`;
},

示例：https://plnkr.co/edit/zNbMPT5HOB9yqI08

结果：