Handlebars: recursive tree structure

Question

I have a tree structure of arbitrary depth that I want to display with Handlebars. I don't see any way to recurse. If I knew the depth, I could hard code it I suppose, but it can be arbitrarily deep.

Something like this, but it needs to recurse at the display children part.

{{#aNode}}
    {{id}
    {{name}}
    {{description}}
    ...spew this same template with each member of {{#children}}...
{{/aNode}}

Handlebars has ways to iterate collections, but no way that I can see to recurse into the children

score 6 · Accepted Answer · answered Oct 08 '13 at 20:22

Found that you can do it with a delegation/embedded file technique. So, it'd look like this:

spew_a_node.mustache (I'm using the Mustache implementation):

{{#aNode}}
    {{id}
    {{name}}
    {{description}}
    {{#children}}
        {{> spew_a_node}}
    {{/children}}    
{{/aNode}}

score 4 · Answer 2 · answered Jun 11 '14 at 15:29

4

Here's a nice article and jsfiddle describing exactly how to do it (which is more or less what Chris Kessel has described in his answer):

http://www.boduch.ca/2014/03/recursive-list-building-with-handlebars.html

answered Jun 11 '14 at 15:29

AsGoodAsItGets

2,886
34
49

Handlebars: recursive tree structure

2 Answers2