Append variable to partial name in handlebars (mustache)

Question

I am using handlebars with grunt assemble, say I have a page that has a data field called 'page', can I pass that data field to the name of a partial (in another partial)?

Eg:

• A page has the 'page' field with the value of 'dashboard-one'
• The partial 'sidebar', that has wrapping mark-up, calls another partial {{ sidebar-*dashboard-one* }} where dashboard-one is the variable above that is passed in from the page
• This means that every page that needs a sidebar can have an associated partial called 'sidebar-dashboard-one', 'sidebar-dashboard-two' etc

Answer 1

You can not pass variable as partial name usual way. There is two possible solutions:

1) If you know all possible names you can statically generate flat template and use it as you want.

Initial data:

{
    "names": [
        { "name": "dashboard-one" },
        { "name": "dashboard-two" }
    ]
}

Static template:

{{#each names}}
    \{{#if name.{{name}} }}
        \{{> sidebar-{{name}} }}
    \{{/if}}
{{/each}}

will produce:

{{#if dashboard-one }}
    {{> sidebar-dashboard-one }}
{{/if}}

{{#if dashboard-two }}
    {{> sidebar-dashboard-two }}
{{/if}}

Then you pass name 'dashboard-one' in template context:

{ "name": "dashboard-one" }

and get partial sidebar-dashboard-one executed.

2) Write custom helper. Handlebars internally use method Handlebars.VM.invokePartial to invoke partials. See, how it works.