B Snow
B Snow

Reputation: 403

How can I set i=index of array before I filter it in Angular 2?

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

Upvotes: 5

Views: 3131

Answers (2)

Richard Luo
Richard Luo

Reputation: 11

add fromGroupName for the formArray

[formGroupName] = "getFormGroupIndex(i)"

for this function compute index:

getFormGroupIndex(index: number): number {
   return index + (this.TableCurPage - 1) * this.ItemPerpage;}

Upvotes: 0

Pengyy
Pengyy

Reputation: 38191

The variable index of *NgFor is for current result. For your situation, you can get the original index by eClients .indexOf(client).

refer plunker.

Upvotes: 7

Related Questions