s

Home > angular > angular add trailing coma if not last item in array

angular add trailing coma if not last item in array edit button Edit

author
Murugan Andezuthu Dharmaratnam | calendar 27 November 2020 | 2034

in my angular application, I wanted to display a comma-separated item name from a list of objects on the HTML page. The problem that I was having that if I add a come in the interpolation like this <span > {{item.Name}}, </span> there will be a trailing comma after the last item. The solution was simple, see the code below.

Solution

Oreiginal Code
<div *ngFor="let item of productDetailsVM.setupcolor" style="display:inline-block">
  <span > {{item.Name}}, </span>
</div>

Solution
<div *ngFor="let item of productDetailsVM.setupcolor; let isLast=last" style="display:inline-block">
  <span > {{item.Name}}{{isLast ? '' : ', '}} </span>
</div>