KendoUI 递归模板

Question

我尝试使用 KendoUI 构造一个 ListView。

因此，我需要创建一个ClientTemplate。

但我想知道的是，在创建 ClientTemplate 之后，如何在其内部使用该模板。

换句话说，如果有意义的话，我想创建一个 Recursive Template。

这是我目前拥有的：

<script type="text/x-kendo-tmpl" id="template">
    <div class="submenu-item">
         #:Name#
    </div>
    <div class="submenu-children">
         # foreach (var child in ChildElements ) { #
             // In here I want to reuse this same template.
         #}#
    </div>
</script>

这背后的想法是，我可以创建一个 ListView 元素及其所有 children。我会将 children 格式化为略带标签。

非常感谢任何帮助。

Answer 1

您不需要在模板中执行#foreach，只需调用

#= kendo.render(kendo.template($("\#template").html()), data.ChildElements) #

如果最底部的子元素没有 ChildElements 属性，您可能运行出错，在这种情况下，只需添加一个

# if(data.ChildElements !== undefined && data.ChildElements.length > 0 ) { #
    #= kendo.render(kendo.template($("\#template").html()), data.ChildElements) #
# } #

请参阅 http://jsbin.com/fagawo/1/edit?html,js,output

中的一些工作示例

KendoUI 递归模板

KendoUI Recursive Template

kendo-ui

kendo-listview

kendo-ui-mvc