I have the below td with 10 columns. I want to underline first 4 columns but not underline remaining 6. Can anyone help me how to accomplish this.
<tr>
<td *ngFor="let column of Columns; let i=index;" class="cell-underline">
<span>{{column.value}}</span>
</td>
<tr>
You should use the directive ngFor and add a condition class. This is an example for you:
<td *ngFor="let column of columns; index as i;">
<span [ngClass]="{'underline': i < 5 }">{{column.value}}</span>
</td>
You can conditionally add the class:
<td *ngFor="let column of Columns; let i=index;" [class.cell-underline]="i < 4">
This will work for you.
<tr>
<td *ngFor="let column of columns; let i=index;" [ngClass]="{cellUnderline: i<4}">
<span>{{column.value}}</span>
</td>
</tr>