comma separated data display in angular on the basis of condition

Viewed 828

I am working on a angular application. I have a ngFor in my html code which is as follows.

<span *ngFor="let data of myData">
                <img  src="assets/myImage.png">
                <span>
                    {{data.title}}</span>,
            </span>

The problem is that myData array can have one single value or more than one value at run time. I want to have a display such that if one value is present then only one value is shown but if more that one value is present those should be separated by comma. In my above code I just put "," after span. It is working fine with more than one value but in case of single value comma still will be there. How can I do that?

1 Answers

you can leverage last local variable of the *ngFor directive https://angular.io/api/common/NgForOf#local-variables

<span *ngFor="let data of myData; last as isLast">
                <img  src="assets/myImage.png">
                <span>{{data.title}}</span>
                <ng-container *ngIf="!isLast">,</ng-container>
            </span>
Related