Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

220
Vistas
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

about 4 years ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

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

refer plunker.

about 4 years ago · Santiago Trujillo Denunciar

0

add fromGroupName for the formArray

[formGroupName] = "getFormGroupIndex(i)"

for this function compute index:

getFormGroupIndex(index: number): number {
   return index + (this.TableCurPage - 1) * this.ItemPerpage;}
about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda