Partials Need Access to Parent

[optikalefx]

It's often the case that you have tabular data that you want to use a template for each row. Which means you need a partial for the initial load and reload of the main table, but also a template of the row so you can add just 1 later down the road.

var rowTemplate = Handlebars.compile( el.innerHTML );
var rowPartial = Handlebars.registerPartial(
    "rowTemplate", 
    el.innerHTML
);

Let's assume the following table HTML

<table>
    {{> rowPartial}}
</table>

And our rowTemplate looks like this

{{#each items}}
    <tr>
        {{#if ../someParentData}}
            <td>something complicated</td>
        {{else}}
            <td>something else</td>
        {{/if}}
    </tr>
{{/each}}

So onload this is perfect, it takes an array of data from the database and pushes displays it just fine.

But what if you want to add just 1 row? Well using this setup you have to

$table.append( rowTemplate({
    parentData: parentData,
    items: {}
}));

So obviously that sucks. So you ask, why make the partial an each loop? Why not make the template and partial the one row?

If our row template was just

<tr>
    {{#if ../someParentData}}
        <td>something complicated</td>
     {{else}}
        <td>something else</td>
    {{/if}}
</tr>

and the table was

<table>
    {{#each items}}
        {{> rowTemplate}}
    {{/each}}
</table>

Then we wouldn't have access to the parent data in the partial or the template because of the loop were inside of.

The only other alternative is to pass ../ into your partial, but then you lose the ability to each loop through your data. So that doesn't work either.

So TL;DR

• You should be able to register a partial with an already compiled template
• Partials should have access to the parent context

[xizhao]

+1

[kentwidman]

Agreed!

[kpdecker]

This is the same issue as #182. Moving discussion over there.