2
votes

ag-grid modifier le nom de l'en-tête du groupe de lignes

J'utilise ag-grid pour afficher une table qui a un Row Grouping . La colonne par laquelle je regroupe est invisible car sa valeur n'a aucune signification.

Par exemple, j'aurai le tableau suivant ( entièrement réduit ):

---------------------------------
|   H1       H2        H3        |
----------------------------------
| > groupId1 (1)                 |
----------------------------------
| > groupId2 (5)                 |
----------------------------------


0 commentaires

3 Réponses :


1
votes

Vous pouvez passer des paramètres supplémentaires sur le rendu de cellule de groupe et le personnaliser comme ceci -

colDef = {
    // set the cell renderer to 'group'
    cellRenderer:'agGroupCellRenderer',
    // provide extra params to the cellRenderer
    cellRendererParams: {
        innerRenderer: myInnerRenderer, // provide an inner renderer
    }
    ...
};

Vous devriez alors pouvoir afficher n'importe quel texte basé sur une logique personnalisée en utilisant le myInnerRenderer code> implémentation.

Voici un exemple de ag-grid docs . Vérifiez la mise en œuvre de Group Renderer C


0 commentaires

2
votes

Un collègue m'a aidé à la fin, sa solution était:

valueFormatter: ({ value, data }) => 'something ' + value

dans le colDef de mon groupe, et la valeur à afficher comme en-tête est envoyée dans 'data'.

/ p>

Il a dit que cellRenderer est exagéré pour une tâche simple comme celle-ci.


0 commentaires

1
votes

Vous pouvez également renommer l'en-tête rowGroup de ag-grid en utilisant cet accessoire simple autoGroupColumnDef

<AgGridReact 
  columnDefs={columnDefs} 
  rowData={rowData}
  autoGroupColumnDef={{
    headerName: 'Name'
  }}
/>


0 commentaires