I need to merge the cells of the year which are same into a single under which the months are arranged based on the corresponding year. I tried with getting the count of year and using it as colspan value but it didn't work
<thead>
<tr>
<th *ngFor="let colItem of YearGrid">{{colItem.Year}}</th>
</tr>
<tr>
<th *ngFor="let colItem of YearGrid">{{colItem.Month}}</th>
</tr>
</thead>
YearGrid = [
{Month: 'Nov', Year: 2020},
{Month: 'Dec', Year: 2020},
{Month: 'Jan', Year: 2021},
{Month: 'Feb', Year: 2021},
{Month: 'Mar', Year: 2021}
];
so please colspan or rowspan
table{
width: 400px
}
table td,table th{
border: 1px solid red;
}
<table>
<tr>
<th colspan="2">Name</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>43</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>57</td>
</tr>
</table>