I have to create a table whith elements like:
Header1 | Header2 | Header2 |
---|---|---|
Data1 | Data2 | Data3 |
I have headers and data taken from api call.
I have tried something like:
<table class="table">
<div *ngFor="let element of apiResp">
<tr>
<th>{{element.header}}</th>
<td>{{element.data}}</td>
</tr>
</div>
</table>
but the result is:
Header1 Data1
Header2 Data2
Header3 Data3
3
Answers
By default, the
<div>
are not displayed horizontally but vertically.What you are trying to do is probably:
Try this:
Avoid additional tags inside the table. The table wouldn’t work as expected if there would be other tags then the table tags (such as tr for TableRow, th for TableHead cell and td for TableData cell etc.)