52

For instance, is there a way to nest my "i18n" helper inside another helper's hash variable? 

{{view "SearchView" placeholder="{{t 'search.root'}}" ref="search" url="/pages/search" className='home-search'  polyfill=true}}
mateusmaso
  • 7,843
  • 6
  • 41
  • 54
  • What's your gripe exactly? The `{{mustache}}` syntax inside the helper, or the fact that you have to pass a localized value to the helper? – jevakallio Feb 11 '13 at 21:27
  • you got it right, I would like to use the {{mustache}} syntax inside the helper instead of pass a localized value to the helper. I'll edit my question, just a second. – mateusmaso Feb 11 '13 at 21:37
  • the problem is that handlebars does not allow you to use an {{mustache}} syntax inside a helper option – mateusmaso Feb 11 '13 at 21:43
  • @mateusmaso I'm trying to achieve the same goal as you. I want to abstract all recurring elements into helpers instead of having the same HTML all over my code (e.g. buttons, inputs, search boxes, etc.). It really helps especially when using something like Bootstrap which makes you write multiple CSS classes. There are more cases other than i18n, for example, setting an input to disabled based on a model attribute - {{inputView disabled={{isDisabled}} }}. Have you found a solution, or are you using the workaround you posted here? – elanh Nov 06 '13 at 14:15
  • Is "isDisabled" a helper? If not you could simply do {{inputView disabled=isDisabled}} – mateusmaso Nov 06 '13 at 16:21
  • 1
    @mateusmaso, if you happen to be around to read this comment, could you unaccept my answer and accept KevinBorders 's answer instead, as indeed it is the better answer. When I wrote mine, this feature was not yet supported. – jevakallio Jul 16 '15 at 18:33
  • 1
    @jevakallio updated :) – mateusmaso Jul 16 '15 at 22:01

2 Answers2

91

Update: Handlebars now supports subexpressions, so you can just do:

{{view "SearchView" (t 'search.root')}}
ozanmuyes
  • 721
  • 12
  • 26
Kevin Borders
  • 2,933
  • 27
  • 32
11

Your scenario is not directly supported, but there a couple of workarounds you can use. The handlebars helpers are just javascript code, so you can execute them from within the helper code itself:

function translateHelper() {
    //...
}

function viewHelper = function(viewName, options) {
    var hash = options.hash;
    if(hash.placeholder) { 
        hash.placeholder = translateHelper(hash.placeholder);
    }
};

Handlebars.registerHelper('view', viewHelper);
Handlebars.registerHelper('t', translateHelper);

And just pass the i18n key to as the argument:

{{view placeholder="search.root"}}

This is nice, as long as your helper knows which arguments should be localized, and which not. If that is not possible, you can try running all the helper arguments through Handlebars, if they contain a handlebars expression:

function resolveNestedTemplates(hash) {
  _.each(hash, function(val, key) {
    if(_.isString(val) && val.indexOf('{{' >= 0)) {
      hash[key] = Handlebars.compile(val)();
    }
  });
  return hash;
}

function view(viewName, options) {
  var hash = resolveNestedTemplates(options.hash, this);
}

And use the nested template syntax you described:

{{view placeholder="{{t 'search.root'}}" }}

I realize neither of these options are perfect, but they're the best I could think of.

jevakallio
  • 35,324
  • 3
  • 105
  • 112
  • thanks man, great answer by the way.. as you said my translateHelper also can take more options so your second solution might be the best workaround for now, I'll just improve the method but the idea still the same.. I'm just wondering if doing this I shall be making mistakes about how handlebars should really work – mateusmaso Feb 11 '13 at 22:27
  • @mateusmaso, my proposed solution is not exactly how handlebars should work, I'll grant you that, but on the other hand I don't see a great alternative to your particular problem. Maybe look into partials and block helpers and see if there's a more natural solution for your case: https://github.com/wycats/handlebars.js/ – jevakallio Feb 11 '13 at 22:38
  • yeah, I asked that same question inside their github repository issue.. let see what they think, but I agree with you.. it cant go too much nested, if so I would have to move it to the scope because the template code will be unreadable – mateusmaso Feb 11 '13 at 22:49