ngFor on a list without creating an intermediate variable

Question

Is there a way to make an *ngFor without creating an intermediate variable : In the example below I declare item but I don't use it, is there a way to remove it?

<div *ngFor="let item of items; let i = index">
   <span>{{items[i]}}</span>
   <span>{{items[i+1]}}</span>
</div>

Answer 1

You could use the ngFor template syntax, without the let-item part:

<ng-template ngFor [ngForOf]="items" let-i="index">
  <div>
    <span>{{items[i]}}</span>
    <span>{{items[i+1]}}</span>
  </div>
</ng-template>

See this stackblitz for a demo.

For more explanations about ngFor, *ngFor and ng-template, see this article by Todd Motto.