Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Recursive partial in mustache.js
<html>
<body>
<div id="hierarchy"></div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/0.7.2/mustache.min.js"></script>
<script type="text/template" id="recursive-partial">
{{#children}}
<li>{{name}}
<ul>
{{>recursive_partial}}
</ul>
</li>
{{/children}}
</script>
<script>
partial = $('#recursive-partial').html()
tmpl = '<ul>{{>recursive_partial}}</ul>';
data = {
children:
[
{
name: 'Foo',
children:
[
{
name: 'Foo.bar',
children: null
},
{
name: 'Foo.baz',
children: null
}
]
},
{
name: 'Bar',
children:
[
{
name: 'Bar.bar',
children: null
},
{
name: 'Bar.baz',
children: null
}
]
}
]
};
html = Mustache.render(tmpl, data, { recursive_partial: partial });
$('#hierarchy').html(html)
</script>
</body>
</html>
@spencerwhyte
Copy link

spencerwhyte commented Jan 20, 2016

Did you ever find a solution to the overflow problem/bug here?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment