He estado buscando soluciones CSS alternativas para poner en mayúscula la primera letra del nombre de encabezado de columnDefs.

Así que aquí está mi solución: -

 Object.keys(row).forEach(field => { columnDef.push({ field: field, headerName: this.customHeader(field) }) }); private customHeader(val: string): string { return val.charAt(0).UpperCase() + val.slice(1); }

Entonces, ¿es posible lograr el uso de mayúsculas [la primera letra mayúscula y el resto serían minúsculas] usando estilos CSS solo para los nombres de encabezado en la cuadrícula?

Mi enfoque para esto fue: -

 columnDef.push({ field: field, headerName: this.customHeader(field), cellStyle: { color: red, textTransform: 'capitalize' } })

Al agregar cellStyle, el estilo CSS no funcionó. Dos observaciones hechas aquí son: -

1. el color rojo se aplicó a todas las celdas excepto al encabezado de la cuadrícula.
2. textTransform ni siquiera se aplica

¡Por favor ayuda! Muchas gracias por adelantado