递归下划线模板

Question

我有以下类型的数组。

[{
  tag:'a',
  href:"#",
  title:"test",
  children:[{
         tag:"div",
         id:"nested-image",
         children:[{
                    tag:"img",
                    src:"image.jpg"
                   }]
         }]
  }]
}]

为了渲染它，我使用的是Underscore模板。我使用了文本插件来加载模板

我正在使用以下功能进行渲染。

  compiledTpl: function(tpl, data) {
        var data = data || {};
        var compiled = _.template(tpl);
        return compiled(data);
    },

从其中一个模板中调用以下函数：

  

在模板内部，我正在迭代数据对象：

 <%_.each(data),function(d){%>
       <p>d.a</p>
       <p>d.b</p>
       <%if(d.children.length>0){%>
        //call same template itself
        <%= _.compiledTpl(tpl1,{'data':data} ) %>//not sure how to do that
      <%}%>
 <%}%>

如果函数调用自身并且一切正常，那么它将不会遍历第一级的所有子级，因为只有一个层次结构存在。它不会遍历所有孩子。我希望实现类似http://techdive.in/java/recursive-templates-underscore-js

的目标