javascript - 使用Handlebars.js进行递归布局

我有一个简单的对象层次结构，包括:

Category
 String name
 List childCategories;

我想以一种通用的方式使用车把来表示这种布局，但是我很难理解如何嵌套布局。给定此布局:

<script id="categories-template" type="text/x-handlebars-template">
    {{#categories}}
        <ul >
            <li>
                <span>{{name}}</span>
                <div>{{#childCategories}}{{/childCategories}}</div>
            </li>
        </ul>
    {{/categories}}
</script>

对所有子类别重用现有类别模板的最佳方法是什么？是否需要注册处理程序？有没有更简单的方法？

最佳答案

两个模板

<!-- language: html -->

<script id="categories-template" type="text/x-handlebars-template">
{{#categories}}
    <ul >
       <li>
          <span>{{name}}</span>
          {{#if childCategories}}
             <div>{{&testHelper childCategories}}</div>
          {{/if}}
       </li>
    </ul>
{{/categories}}
</script>

<script id="categories-nested" type="text/html">
    {{&testHelper categories}}
</script>

和一个把手助手

Handlebars.registerHelper('testHelper', function(info) {
    var template = Handlebars.compile($('script#categories-template').html());
    return template(categories);
});