[Fixed] access to the index of item in *ngFor

Issue

I have a loop in my html page. The code is:

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

In the line <a class="thumbnail" [routerLink]="['/single-picture/:comment', {comment:item.index} ]">

I want to pass the index of current item in the loop.

How can i do it?

Solution

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

Leave a Reply

(*) Required, Your email will not be published