Need help to display nested Arrays in JSON Objects - Angular 2

[Bharathiraja Narayanan]

I am trying to display Nested Array Json data with configurable attributes only instead of all attributes, but it's displaying [Object, Object] for array property like "roomTypes".

Kindly help to display value instead Object.

x.component.ts ->

//getItemById() service call

res.json().data

x.constant.ts -> 

{jsonAttributeNames:["name","roomTypes"]}

x.component.html -> 

<table>....

<tbody>

<tr>                 

   <td *ngFor="let attributeName of jsonAttributeNames" >

                        <div *ngIf="data"> {{data[attributeName]}}</div>

                    </td>

</tr>

</tbody>

</table>

Json Data ->

{"name":"test","roomTypes":[{"Name":"living room"},{"Description":"Mock Description"},{"Name":"Bathroom"},{"Description":"Mock Description"}]}

[Sander Elias]

Hi Bhararthiraja,

If you want to put out the raw data use the JSON filter.

Otherwise, you need to add some logic to iterate over arrays. Looking at your data, I would opt for doing some preprocessing in a service, to make it easier to group things that belong to each other.

Regards

Sander