I am currently having trouble when paginating a list of clients in Angular 2. Here is a snippet of my code:
<tr *ngFor="let client of eClients | filter:term | paginate: { itemsPerPage: 20, currentPage: p}; let i = index" (click)="toggleClient(i)">
<td>
<checkbox [(ngModel)]="eClients[i].selected">
{{client.name}}
<checkbox>
</td>
</tr>
The problem is the index is not corresponding to the actual position in the array. For example, if I go to page 2 and click on client #2 in the list I should get an index of 22, however I am getting 2. It seems that the index only spans from 0-19 as I move from page to page. It is filtering the data first and then setting an index. How can I set "i=index" before any of the filters or pagination take place?
P.s. "checkbox" is my own module and "term" is my own pipe filter.
Please help. Thank You
The variable index
of *NgFor
is for current result. For your situation, you can get the original index
by eClients .indexOf(client)
.
refer plunker.