How to display 4 values in every row in html using ngfor and ngif?

Issue

I want to display key value pair via for loop in table, tr tag. 3-4 pairs I want to display in one row.

Added my code here- https://stackblitz.com/edit/angular-ivy-hrqira?file=src/app/app.component.ts

I want to display 4 values each in the row. Updated my question with this link.

<table>
<div *ngFor="let table of uiFields | keyvalue">
<tr><td><label>{{table.key}}</label><label>{{table.value}}</table></td>
</tr>
</div>
</table>

I am getting values one below the other, I want to display 3-4 pairs in one line. uiFields is my map containing different values.

Solution

    <table>
    <tr><td *ngFor="let table of uiFields | keyvalue"><label>{{table.key}}</label><label>{{table.value}}</table></td>
    </tr>
    </table>

Answered By - Deepak A