Comma Separate String using handlebars.js

Question

These days working i am working with handlerbars.js and it seems pretty interesting. In there i need a small help from you guys.

i have a following json input

"ALERTS": [
    {
        "alert_description": "ALCOHOL",
    },
    {
        "alert_description": "DIAGNOSIS",
    }
]

and i need to write a template to create following comma separated string.

ALCOHOL, DIAGNOSIS

i was able to print these values using line by line using following template.

<div>
   <div>
{{#each this}}
    <span>{{alert_description}}</span>
{{/each}}
</div>
</div>

can you guys please help me to solve this issue? appreciate your help

Thanks Keth

David Tinker · Accepted Answer · 2017-12-22 07:26:42Z

7

You can do this without writing a helper by using {{#each}} and testing the implicit @index variable:

{{#each this}}
    {{#if @index}}, {{/if}}
    <span>{{alert_description}}</span>
{{/each}}

You can also test @first and @last (see handlebarsjs docs).

edited Dec 22, 2017 at 7:26

answered Dec 22, 2017 at 7:18

David Tinker

9,70410 gold badges72 silver badges104 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Cybermaxs · Accepted Answer · 2013-05-14 07:36:46Z

3

For this kind of scenario, I will create a helper.

Here is my implementation

Handlebars.registerHelper('commalist', function(items, options) {
  var out = '';

  for(var i=0, l=items.length; i<l; i++) {
    out = out + options.fn(items[i]) + (i!==(l-1) ? ",":"");
  }
  return out;
});

and the template

<div>
   <div>
    {{#commalist this}}
       <span>{{alert_description}}</span>
    {{/commalist}}
   </div>
</div>

In fact, the helper is here only for comma. You can still put html inside the helper (span, div, ...)

answered May 14, 2013 at 7:36

Cybermaxs

24.6k8 gold badges86 silver badges113 bronze badges

Collectives™ on Stack Overflow

Comma Separate String using handlebars.js

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related