l'accès à l'index de l'élément dans la *ngFor

J'ai une boucle dans ma page html. Le code est:

<li *ngFor="let item of items" style="display: inline;">    
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
           <a class="thumbnail" [routerLink]="['/single-picture/:comment', {comment:item.index} ]">
                <img  [src]=item.images.low_resolution.url>
           </a>
    </div>       
</li>

Dans la ligne <a class="thumbnail" [routerLink]="['/single-picture/:comment', {comment:item.index} ]">

Je veux passer l'index de l'élément courant dans la boucle.

Comment puis-je le faire?

  • voici la syntaxe: <li *ngFor="laisser élément d'éléments; soit i = index">...</li>
InformationsquelleAutor Jeff | 2016-08-12
  1. 14
    <li *ngFor="let item of items;let i=index" style="display: inline;">      //<---added let i=index

    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
       <a class="thumbnail" 
          [routerLink]="['/single-picture/:comment', {comment:i} ]">      //<-----changed this line 
           <img  [src]=item.images.low_resolution.url>
        </a>
    </div>  

</li>
    InformationsquelleAutor micronyks
  2. 3

    Voici la syntaxe à partir de la documentation

    Syntaxe

    <li *ngFor="let item of items; let i = index">...</li>
<li template="ngFor let item of items; let i = index">...</li>
<template ngFor let-item [ngForOf]="items" let-i="index"><li>...</li></template>

    reportez-vous à la documentaion ici

    pour votre cas :

    <li *ngFor="let item of items;let i=index" style="display: inline;">    
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
           <a class="thumbnail" [routerLink]="['/single-picture/:comment', {comment:item.index} ]">
                <img  [src]=item.images.low_resolution.url>
           </a>
    </div>       
</li>
    InformationsquelleAutor Mehari