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) | ----------------------------------
3 Réponses :
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
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.
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'
}}
/>