I am getting data from api and want to show in a table and in table I have # column for serial number now i want to show the serial number I have done so far this but its shows 1 to 10 serial number on every page when I change the page it shows 1- 10 counting start from 1 when ever the next page is load
<tbody>
<tr *ngFor="let user of _data | paginate: { itemsPerPage: 10, currentPage: p }; let i=index">
<th>{{i + 1}}</th>
<th>{{user.FirstName}}</th>
<th>{{user.LastName}}</th>
<th>{{user.Email}}</th>
<th>
<button *ngIf="user.IsActive==false" class="btn btn-success btn-xs" (click)="changeStatus(user.Id)"> <i class="fa fa-check"></i> Active </button>
<button *ngIf="user.IsActive==true" class="btn btn-danger btn-xs" (click)="changeStatus(user.Id)"><i class="fa fa-trash-o"></i> Block</button>}}
</th>
</tr>
</tbody>
Answer is.
{{ (config.currentPage - 1) * config.itemsPerPage + i +1 }}
Something like
<th>{{(currentPage + 1) * itemsPerPage + i + 1}}</th>
should do what you want.
*ngFor
doesn't know about your whole table, it only knows about the items of the current page (returned by _data | paginate
)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With