Question

我想创建一个递归模板，以便它处理所有孩子 - 无论多深。

让我们说上下文看起来像

{
  div:true
  ,id:'root'
  ,children:[
    {div:true,id='root-1'}
    ,{div:true,id='root-2', children:[
      {div:true,id='root-2.1'} //etc,ect...      
     ]}
    }
}

我想说：

var div_tpl='{#div}'+
  '<div{#id} id="{id}"{/id}{#class} class="{class}"{/class}>'+
  '{#children}{>div_tpl/}{/children}'+ //self-ref here
  '</div>{/div}';

dust.compile(div_tpl,'div_tpl');

当然，当我提供数据时，它会挂起。我也试过div_tpl1和div_tpl2，每个引用另一个。所以现在我只需要确认它“不可能”。

Answer 1

好消息是这是可能的。看来你遇到的麻烦与Dust查找的方式有关。目前，{#children}将查看当前上下文，然后（如果它在当前上下文中找不到任何内容）在所有父上下文中。

因此，在您的示例中，Dust将开始渲染第一个div（id="root"），然后找到它children，然后开始渲染它们。它会渲染第二个div（id="root-1"），然后查找children。它在当前上下文中找不到children，因此它将在父上下文中查找，它将找到children。然后灰尘再次渲染第二个div，再次搜索孩子，然后无限循环。

您可以使用点符号来避免无限循环：

...
{#.children}
    {>div_tpl/}
{/.children}
...

有关工作示例，请参阅此jsfiddle。

DustJS无限嵌套

1 个答案: