Handlebars.js: is it possible to render a partial from inside a custom helper?

[mattkime]

I would like to do something like the following -

Handlebars.registerHelper('include', function(path, options) {
  return Handlebars.renderPartial(path, context, hash); //this is a js interface which matches the hbs partial interface
});

my primary reason for wanting this is that i have some partials that i'd like to use with helper syntax. my helper could also extend partial functionality. for example, it could take the block content and pass it as a var into the partial template as a context var.

[doowb]

You can compile and render any string inside the helper. So if you have already added your partials with Handlebars.registerPartial('my-partial', 'my partial content'), you can do this...

Handlebars.registerHelper('include', function (path, options) {
  var partial = Handlebars.partials[path];
  if (typeof partial !== 'function') {
    partial = Handlebars.compile(partial);
  }
  return partial(context); // build up the context some how
});

Then use it in handlebars like {{include 'my-partial'}}.

[mattkime]

thanks @doowb

does Handlebars.compile work within handlebars-runtime?

i'd still need a way of passing hash params

[kpdecker]

Handlebars runtime explicitly omits the compile method. You can pass your own hash parameters by passing them in the call to partial.

Closing this as it's not a but of feature request and there's been no activity for a few days.

[davehibshman]

I know it's closed and old, but it doesn't have an answer or example. I am doing this and it seems to work for the simple cases I have tried - I haven't tried complex cases.

<!-- compiled as Handlebars.template.displayName -->
{#each this}}
Hello {{#if isMale}}Mr.{{else}}Mrs.{{/if}} {{renderPartial nameRenderer this}}
{{/each}}

Handlebars.registerPartial("capital", "{{captialize firstname}} {{captialize middleName}} {{captialize lastname}}");
Handlebars.registerPartial("midinit", "{{upper firstname}} {{upper middleName}} {{upper lastname}}");
Handlebars.registerPartial("midinit", "{{firstname}} {{firstChar middleName}} {{lastname}}");
Handlebars.registerHelper('renderPartial', function(partial, context) {
    return Handlebars.compile(Handlebars.partials[partial])(context);
});
Handlebars.registerHelper('firstChar', function(name) {
    return name.substring(0,1);
});
Handlebars.registerHelper('upper', function(name) {
    return name.toUpperCase();
});
Handlebars.registerHelper('captialize', function(name) {
    return name.substring(0,1).toUpperCase() + name.substring(1);
});
var data = [{
  isMale: true,
  firstname: "david",
  middleName: "tom",
  lastname: "henry",  
  nameRenderer: "capital"
}, {
  isMale: true,
  firstname: "david",
  middleName: "tom",
  lastname: "henry",  
  nameRenderer: "midinit"
}, {
  isMale: false,
  firstname: "nancy",
  middleName: "tracey",
  lastname: "henry",  
  nameRenderer: "uppercased"
}];

Handlebars.template.displayName(data);
/* returns
Hello Mr. David Tom Henry
Hello Mr. david t henry
Hello Mrs. NANCY TRACEY HENRY
*/