Why index variable not display indexing in *ngFor loop in Angular 2?

user_6262169 0
Viewed 4361

If we want to display the index of ng-repeat in angular 1,

we use the following code

<div ng-repeat="car in cars">
 <ul>
  <li>Index: {{$index+1}}</li>
  <li>Car Name:{{car.name}}</li>
 </ul>
</div>

Now when the same I implement in Angular 2, it is not displaying index value

<div *ngFor="#car of cars">
 <ul>
      <li>Index: {{index+1}}</li>
      <li>Car Name:{{car.name}}</li>
     </ul>
 </div>

But when I add #i = index in *ngFor, it suddenly display index value 

 <div *ngFor="#car of cars; #i = index">
     <ul>
          <li>Index: {{i+1}}</li>
          <li>Car Name:{{car.name}}</li>
         </ul>
 </div>

As both 2nd and 3rd code are same, but it work only when we declare the local variable and assign the variable to index.

Such an ambiguous thing.

Will any one help to understand better use of this ?

ngfor angular loops javascript
6 Answers
<div *ngFor="let car of cars; index as i">
  <ul>
    <li>Index: {{i}}</li>
    <li>Car Name:{{car.name}}</li>
  </ul>
</div>
user_28842910
Related