Как управлять специальными символами в конце ngFor

Question

Я занимаюсь веб-сайтом, на котором я должен представить блюда шеф-повара, данные были собраны из бэкэнда, и я представляю их с помощью ngFor следующим образом:

<div *ngFor="let i of item.specialty">
 <p  style="display: inline-block;"> {{i.name}}, &nbsp; </p>
</div>

Как вы видите, добавьте запятую, чтобы показать различные специальности, за которыми следует запятая, проблема в том, что к последнему элементу также добавляется запятая. Как я могу контролировать, чтобы запятая не появлялась в последнем элементе, который приносит ngFor

Answer 1

Используйте следующий код last из *ngFor, он имеет различные свойства, такие как index, first, last, even, odd

<div *ngFor="let i of item.specialty; let last = last;">
 <p  style="display: inline-block;"> {{i.name}}
     <span *ngIf="!last">, &nbsp;</span>
 </p>
</div>