Forums Ignite UI for React
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Ifti Younas
30
how to access nested properties of an object while defining columns in grid
posted

I have a data set that looks like this

const data = [ { newYork: {id: 3, name: 'newYork', xyz: 123 }, ... ];

I want to access the name property of the nested json object, this is how i am currenlty doing it.

<IgrTextColumn
    name={obj}
    key={`${obj}.name`}
    field={`${obj}.name`}
    headerText={`${obj}`}
    width='*>170'
    horizontalAlignment='center'
    pinned={obj === 'Zone' ? 'left' : 'none'}
    columnOptionsIconBehavior={obj === 'Zone' ? 'AlwaysVisible' : 'Unset'}
    isColumnOptionsEnabled={obj === 'Zone' ? 'true' : 'false'}
/>
the data grid displays the property in the grid but the problem is when the name field has ' . '(dot) in it the grid doesn't display the name it probably thinks there is another nested property to access. Below is an example of such case

const data = [ { newYork: {id: 3, name: 'newYork.phase1', xyz: 123 }, ... ];
if there is a better way to do this, where I can access the nested properties of an object that would be great.