How to skip the first and the last item in a *ngFor

Question

I have a list of items. The first row is a kind of header. The last row is a kind of footer. My header and footer need a specific treatment, so I don't want to display through this loop.

json:

{
  "items": [1,2,3,4]
}

My code right now:

<ul *ngFor="let item in items">
 <li>{{item}}</li>
</ul>

Output is:

<ul>
 <li>1</li>
 <li>2</li>
 <li>3</li>
 <li>4</li>
</ul>

Output should be:

<ul>
 <li>2</li>
 <li>3</li>
</ul>

Answer 1

You can use the shiny slice pipe:

Creates a new Array or String containing a subset (slice) of the elements.

<ul>
    <li *ngFor="let item of items | slice:1:items.length-1">{{item}}</li>
</ul>

• Try it Online!
• SlicePipe