How do I add a separator between elements in an {{#each}} loop except after the last element? How do I add a separator between elements in an {{#each}} loop except after the last element? javascript javascript

How do I add a separator between elements in an {{#each}} loop except after the last element?


I know I'm late to the parts but I found a WAYYYY simpler method

{{#unless @last}},{{/unless}}


Since Ember v1.11 you are able to get the index of an each using block parameters. In your case this would look something like this:

{{#each list as |item index|}}    {{if index ", "}}{{item.name}} {{item.status}}{{/each}}

The first index value will be 0 which will evaluate to false and will not be added, all subsequent values will evaluate to true which will prepend a separator.


You can use standard CSS to do this:

li:after {    content: ',';}li:last-of-type:after {    content: '';}

I prefer separate rules, but a more concise if slightly less readable version (from @Jay in the comments):

li:not(:last-of-type):after {    content: ',';}