Kendo：如何在 TreeView 中创建递归层次结构？答案

【问题标题】：Kendo: How do I create a recursive hieiarchy in the TreeView?Kendo：如何在 TreeView 中创建递归层次结构？
【发布时间】：2015-04-09 03:20:52
【问题描述】：

我正在使用 Kendo UI 并试图弄清楚如何让 TreeView 显示递归层次结构。首先，这是我的模型（我正在通过 OData 检索这些对象的列表）：

public class PageTreeItem
    {
        public Guid Id { get; set; }

        public string Name { get; set; }

        public bool IsEnabled { get; set; }

        public PageTreeItem[] SubPages { get; set; }
    }

这是我的 JavaScript：

var PagesDS = new kendo.data.HierarchicalDataSource({
        type: "odata",
        transport: {
            read: {
                url: "/odata/cms/PageTree",
                dataType: "json"
            }
        },
        schema: {
            data: function (response) {
                return response.value;
            },
            total: function (response) {
                return response.value.length;
            },
            model: {
                id: "Id",
                children: "SubPages"
            }
        }
    });

    PagesDS.read();

    $("#treeview").kendoTreeView({
        template: kendo.template($("#treeview-template").html()),
        dataSource: PagesDS,
        dataTextField: ["Name"]
    });

最后是标记：

<div id="treeview"></div>

<script id="treeview-template" type="text/kendo-ui-template">
        <a href="javascript:void(0)" onclick="viewModel.edit('#=item.Id#')">#= item.Name #</a>
    </script>

我只能显示顶级项目。显然，在 schema-> model 中设置“children”属性是行不通的。如何实现我想要的？

【问题讨论】：

标签： javascript kendo-ui kendo-treeview

【解决方案1】：

好的，忽略..我的问题是子页面实际上并没有被首先返回...哎呀！我只是假设它们会自动与其他所有内容一起序列化。我需要在我的 OData 查询中提供 $expand 选项，如下所示：

read: {
                url: "/odata/cms/PageTree?$expand=SubPages",
                dataType: "json"
            }

【讨论】：