表示カンマ区切り値：

Question

これは、この質問の続きです：How to display comma delimited JSON value as a list?

私はこの配列があります。

var ARTISTS: Artist[] = [ 
    { 
    "name": "Barot Bellingham", 
    "shortname": "Barot_Bellingham", 
    "reknown": "Royal Academy of Painting and Sculpture", 
    "bio": "Some bio here...", 
    "friends": [ 
     "james", 
     "harry", 
     "bob" 
    ] 
    }, 
    // etc... 
] 

をそして私が注文したリストとして「友人」を表示する必要があります。私はこのようなので、やっている：私は続けることができますどのように

var ARTISTS: Artist[] = [ 
    { 
    "name": "Barot Bellingham", 
    "shortname": "Barot_Bellingham", 
    "reknown": "Royal Academy of Painting and Sculpture", 
    "bio": "Some bio here...", 
    "friends": "James, Harry, Bob" 
    } 

：これは完璧に動作

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

、しかしが、私は今はネストされた配列が存在しないように、私のデータを再構築する必要があります友だちを別のリストアイテムとして表示する：

<ol> 
    <li>James</li> 
    <li>Harry</li> 
    <li>Bob</li> 
</ol> 

ありがとう！

Answer 1

単にtoString()メソッドを使用して、コンマで区切られた文字列のリストを表示します。

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

は、だからあなたの場合にはあなただけのこれを変更することができます。たとえばこれに

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

：

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

あなたは、セパレータを変更したい場合は、カンマの後にスペースを追加する場合は、あまりに配列の方法：代わりに

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

今、あなたはこのように、文字列から配列を作成し直すng-repeatを使用し、カンマで区切られた文字列としてモデル内のリストを持っている場合：

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