web-dev-qa-db-ja.com

Angular 2のリスト区切り文字としてコンマを使用する

テンプレートにコンマで区切られたアイテムのリストを作成したいのですが、最後のアイテムにコンマを付けたくないのです。

one, two, three

Angular 2のテンプレート構文でこれを達成するにはどうすればよいですか?

42
Mark Rajcok

Ericの回答のほうが好きです(Plunkerのサンプルについては、彼のコメントを参照してください)。

<span *ngFor="let item of items; let isLast=last">
   {{item}}{{isLast ? '' : ', '}}
</span>

私の元々の答えは、オプションのindexNgFor microsyntax で使用することでした:

<span *ngFor="#item of items, #i=index">
   {{item}}{{i === items.length - 1 ? '' : ', '}}
</span>

別の方法は、CSS ::before構文(ここで説明): https://stackoverflow.com/a/31805688/215945

108
Mark Rajcok

もっと簡単なアプローチは

<span> {{items.join(", ")}} </span>
31
Nikhil Nambiar