Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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 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 by getting my modal id being "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}}".

like image 953
igorsantos07 Avatar asked Apr 16 '15 05:04

igorsantos07


People also ask

How do you pass variables to handlebars?

To have access to the passed arguments, you need to look for them into the 'hash' object: {{hash. foo}}. (I'm new with handlebars and this took me a while to figure out) - Thanks, great helper! Note, this requires you to have your partials pre-compiled before using the helper.

How do I concatenate a variable in JavaScript?

In JavaScript, we can assign strings to a variable and use concatenation to combine the variable to another string. To concatenate a string, you add a plus sign+ between the strings or string variables you want to connect. let myPet = 'seahorse'; console.

What does variable triple brace meaning in handlebars?

Because it was originally designed to generate HTML, Handlebars escapes values returned by a {{expression}} . If you don't want Handlebars to escape a value, use the "triple-stash", {{{ . Source: https://handlebarsjs.com/guide/#html-escaping.

What is helper in handlebars?

A Handlebars helper call is a simple identifier, followed by zero or more parameters (separated by a space). Each parameter is a Handlebars expression that is evaluated exactly the same way as described above in "Basic Usage": template {{firstname}} {{loud lastname}}


2 Answers

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}} 
like image 135
Mike Post Avatar answered Oct 12 '22 12:10

Mike Post


I got here looking for a concat helper in handlebars.js. In case it's useful to someone landing here looking for the same, handlebars-helpers has an append helper built-in.

{{> my-modal modal-id=(append "add-item-" title) header=(append "New " title)}} 

https://github.com/helpers/handlebars-helpers

like image 32
jiminy Avatar answered Oct 12 '22 12:10

jiminy