Currently working on a project involving AG grid, but encountering an issue with TypeScript. The error message states ([AG-Grid] Property 'children' does not exist on type 'ColDef') and it appears when using the filter method around (column => column.children).
After referring to the AG-Grid documentation, it seems that column defs do support using children as a property. So why am I receiving this error?
https://i.sstatic.net/9GTmE.png
import { ColDef, ColGroupDef } from 'ag-grid-community';
export const sampleItems: Array<{
label: string;
value: string;
}> = [];
export const TABLE_COLUMN = [
{
headerName: 'User',
children: [
{
field: 'user',
headerName: 'Name',
pinned: 'left',
type: 'fixed',
},
{ field: 'account', pinned: 'left', type: 'fixed' },
{
field: 'price',
headerName: 'Pricing',
pinned: 'left',
type: 'primary',
},
],
},
{
headerName: 'Address',
children: [
{ field: 'address', headerName: 'Address', type: 'secondary' },
{
field: 'street',
headerName: 'Street Name',
columnGroupShow: 'closed',
type: 'secondary',
},
],
},
] as (ColDef<object> | ColGroupDef<object>)[];
TABLE_COLUMN.filter((column) => column.children != null).forEach(
(column) => {
column.children.forEach((child) => {
if (child.type === 'fixed' || child.type === 'primary') {
sampleItems.push({
label:
child.headerName ??
child.field.charAt(0).toUpperCase() + child.field.slice(1),
value: child.field,
});
}
});
},
);