Question

I have a use case where I’d like to access parent tags within list loop sections in a Mustache/Hogan JS template.

For example, this is my data structure:

var data = {
  users: [{name: "John", age: 100},{name: "Max", age: 80}],
  meta: {membership: "full"}
};

..and this is my Mustache/Hogan JS template:

{{#users}}
h1 Hello there, {{name}}
{{/users}}

..which renders as:

<h1>Hello there, John</h1>
<h1>Hello there, Max</h1>

This is all well and good, but is it possible for me to access the meta.membership parent variable within the {{#users}…{{/users}} section? It seems that the tags are limited to the local context, so I can’t output the value of the meta.membership tag while iterating over users.

Ideally I want to know if something like this is possible:

{{#users}}
h1 Hello there, {{name}}
p You have a {{meta.membership}} membership
{{/users}}

Desired result:

<h1>Hello there, John</h1>
<p>You have a full membership</p>
<h1>Hello there, Max</h1>
<p>You have a full membership</p>

Thanks in advance

Answer 1

PEBKAC!

It turns out Hogan JS does support the Context Bubbling spec so my desired input as per the question does in fact evaluate to my desired output! 🙂 I was just having problems getting this to work as expected because I was dealing with a heavily nested dataset & several Mustache includes so I had made a few silly errors along the way that were giving me blank outputs.

All good now – though I think I’d better go find me a Hogan debugger to save from further frustration in the future… 😉