将Asp.net MVC模型数据绑定到kendo TreeView模板（本地数据）

Question

我正在使用模板在kendo Treeview中显示我的数据。目前，该数据来自Asp.net MVC模型。我是剑道新手。我看到了各种用于绑定本地数据的kendo示例，但我很困惑如何在kendo树视图中将我的本地数据绑定到模板中。

我知道这有点模糊。感谢您的快速回复。

任何简单的例子都可以提供很大的帮助。

Answer 1

这是ASP.NET MVC和Kendo UI的基本示例。有关更多信息，请参阅Telerik documentation

查看

<script id="TreeViewTemplate" type="text/kendo-ui-template">
    <div>
        <span style="background-color: Pink">#: item.text #</span>
        <span style="background-color: yellow">#: item.id #</span>
        <span style="background-color: Green">#: item.expanded #</span>
    </div>
</script>


@(

     Html.Kendo().TreeView()
                 .Name("TreeViewTemplateBiding")
                 .TemplateId("TreeViewTemplate")
                 .BindTo((IEnumerable<NodeViewModel>)ViewBag.Tree, (NavigationBindingFactory<TreeViewItem> mappings) =>
                            {
                                mappings.For<NodeViewModel>(binding => binding.ItemDataBound((item, node) =>
                                {
                                    item.Id = node.Id.ToString();
                                    item.Text = node.Title;
                                    item.Expanded = node.Expanded;
                                })
                        .Children(node => node.Children));
                            })
)

<强>控制器

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var items = new List<NodeViewModel>();

        var root = new NodeViewModel { Id = 1, Title = "Root" };
        items.Add(root);

        root.Children.Add(new NodeViewModel { Id = 2, Title = "One" });
        root.Children.Add(new NodeViewModel { Id = 3, Title = "Two" });

        this.ViewBag.Tree = items;

        return View();
    }
}

public class NodeViewModel
{
    public NodeViewModel()
    {
        this.Expanded = true;
        this.Children = new List<NodeViewModel>();
    }

    public int Id { get; set; }
    public string Title { get; set; }
    public bool Expanded { get; set; }

    public bool HasChildren
    {
        get { return Children.Any(); }
    }

    public IList<NodeViewModel> Children { get; private set; }
}