ember.jshandlebars.jscustom-component

Sane way to concat string and variable in Handlebars.js helper argument?

I'm trying to build a simple modal component in Ember, but it seems the "logic-less" of Handlebars is too illogical for me. Is there any sane way to achieve a result somewhat like this?

<h2>Nice block about {{title}}</h2>
<a href="#" data-toggle="modal" id="add-item-{{title}}"> {{!this works}}

{{#my-modal modal-id="add-item-{{title}}" header='New {{title}}'}} {{! those don't}}
  <p>My body blabla</p>
{{/my-modal}}

Currently I end up getting my modal id as "add-item-{{title}}", literally, as well as the modal title.

And... no, for now I'm not considering passing the "title" as a new param and using it in the modal. The modal header in another template might not be "New {{title}}" but "are you sure?" or "details about {{title}}".

Solution

  • What you're looking for the is the concat helper. Using it, your second example would become:

    {{#my-modal modal-id=(concat 'add-item-' title) header=(concat 'New ' title)}} 
  <p>My body blabla</p>
{{/my-modal}}