0

I am trying to generate a dynamic table by getting data from array. Please check the attached image in which there is the array of result which I am getting from API. I am trying to use keys as table headers and values as table data.

I have tried with *ngFor loop and through key value loop but I am not getting anything from array.

Below is the code chunk I am using:

<th style="text-align:center" *ngFor="let row of debugQueryData; index as i">{{row}}</th>

Moreover, I am getting data correctly in debugQueryData.

How can I write the correct loop to generate dynamic table?

enter image description here

Improve this question

1 Answer 1

Reset to default
1

you can use this code <th *ngFor="let key of objectKeys(debugQueryData)">{{key + ' : ' + debugQueryData[key]}}</th>

what this code does is to get each key of your object individually then getting then value by passing key to object

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

ow sorry my bad use this Object.keys()
Getting Error -> Cannot read property 'key' of undefined at Object.eval
Am I missing anything else? I have used the code as such but getting error
this for that I wrote you gets keys of each object inside but your object is in another array first you should loop inside the array, get each object and then again loop inside the object `` <ng-container *ngFor="let eachObject of debugQueryData" > <th *ngFor="let key of objectKeys(eachObject)">{{key + ' : ' + eachObject [key]}}</th> </ng-container> ``

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.