Support Nested Properties as Fields in Igx Grid

Currently the data grid only works on flat data. Are there any plans to support nested objects?

E.g

{

name: ‘My Name’,

address: { street: ‘2 Street’, county: ‘Kent’, postcode: ‘AA1 2BB’}

}

You can’t put the field as address.street or address.postcode as that is not supported.

Having to flatten all the data before giving it to the grid is quite problematic especially if you also want to be able to edit data and then send that back so you need to keep it in the original structure.

The alternative suggested is to use a cell template as you can then access the row data and the nested property. However, this then doesn’t work for filtering or sorting the data.

Hello Katy,

Thank you for posting in our community.

You assumption is correct, at this point igx-grid`s main purpose is to handle flat data although this does not mean that it is impossible to work with more complex data.

In this topic in our documentation complex data binding is explained step by step along with sample creation. The data format, that the sample uses looks like the following:

export const EMPLOYEE_DATA = [
    {
        Age: 55,
        Employees: [
            {
                Age: 43,
                HireDate: new Date(2011, 6, 3),
                ID: 3,
                Name: "Michael Burke",
                Title: "Senior Software Developer"
            },
            {
                Age: 29,
                HireDate: new Date(2009, 6, 19),
                ID: 2,
                Name: "Thomas Anderson",
                Title: "Senior Software Developer"
            },
            .
            .
            .
            ]

As you mentioned, this approach uses cell templating which works on the presentation layer, however, grid features manipulate the underlying data and they are not going to work as per your expectation.

In case that you would like to see this feature implemented in any of our future releases my suggestion would be to submit a feature request in our GitHub repository here. This will give you the opportunity to directly communicate with our developers and receive notification whenever a new information regarding your request is available.

Please have a look at the information provided and let me know if you need any further assistance with this matter.

Sure I have raised a feature request for it.

Thanks

Hello,

Thank you for taking time to convey your feedback. We consider our customer`s needs crucial for steering improvements at Infragistics.

Thank you for using Infragistics components.

Hi Katy,

I have fought this same problem and thankfully was able to implement a solution that allowed me to sort and filter columns with nested data.

Before I get to that though I want to second your call for a need to support non-flattened data. It’s counter-intuitive to how I’ve worked with grids in other platforms. I’ve even brought this up to IG representatives at conferences who’ve agreed with me. Would love to see this happen! If you could supply a link to your feature request that I could vote on I certainly would.

Anyway, as to your particular problem, the way to get what your after is to implement a custom filter using the various IgxFilteringOperands that are offered. For sorting you would instead implement a custom sorter.

That’s the route I took and it worked fine, it was just more effort than I’d like to have to go through.

Feel free to reach out to me if you want any help (such that I can provide heh)

My request is here https://github.com/IgniteUI/igniteui-angular/issues/7083

Thanks will take a look at that example