How to select the nth child with ng-content in angular

Question

I want to be able to select the children by their position. For example:

<ul>
  <li>
    <ng-content select=":nth-child(1)"></ng-content>
  </li>
  <li>
    <ng-content select=":nth-child(2)"></ng-content>
  </li>
</ul>

Is it possible?

Answer 1

Use structural directive ngFor and then work with index

<ul>
  <li *ngFor="let item of items; let i = index">
  {{i}} {{item}}
</li>