Display Comma Separated Values As List Items:

This is a continuation from this question: How to display comma delimited JSON value as a list? I have this array: var ARTISTS: Artist[] = [ { 'name': 'Barot Bellingham',

Solution 1:

Simply use the toString() method to display the list of a string separated by commas.

var friends = ['a', 'b', 'c'];
console.log(friends.toString());

So in your case you could just change this:

<li *ngFor="let friend of artist.friends">{{friend}}</li>

to this for example:

<div>{{artist.friends.toString()}}</div>

If you want to change the separator, or add a space after the commas, you can use the join() method of arrays too:

var friends = ['a', 'b', 'c'];
console.log(friends.join(', '));

Instead if now you have in your model the list as a string separated by comma, use the ng-repeat recreating an array from the string in this way:

<li *ngFor="let friend of artist.friends.split(', ')">{{friend}}</li>