ASP.NET MVC 4生成具有递归局部视图的树视图

Question

我在MVC 4项目中有一个局部视图,它是强类型的.它需要一个数据库表的IEnumerable集合.在该表中,存在用于存储记录之间的分层连接的ID,名称和父ID.调用局部视图的视图也是强类型的,它将整个数据库作为模型,并将Categories表作为可枚举集合传递给局部视图:

@Html.Partial("_TreeCategories", @Model.Categories.ToList())

在局部视图中,我想首先获取根节点,因此我可以以递归方式扩展整个树.在数据库表中,所有记录都被视为具有ParentID == null的根节点.
所以一般来说,我这样做的方式如下:

@model IEnumerable<TreeCollections.OpenAccess.Category>

@if (Model.ToList().Count >= 0)
    {
    @if (Model.ToList()[0].Parent_id == null)
    {
        <text><ul id="navigation"></text>
    }

    @foreach (var node in @Model)
    {
        <li><a href="?@node.Id">@node.Name</a>
            @foreach (var subNode in @Model.Where(s => s.Parent_id == node.Id))
            {
                @Html.Partial("_TreeCategories", subNode)
            }
        </li>
    }
    @if (Model.ToList()[0].Parent_id == null)
    {
        </ul>
    }
}

所以我检查Model的第一个元素的ParentID是否为null,如果是,那么它应该创建一个id为"navigation"的<ul>标记,这样jquery插件就可以识别出它是一个树视图控件.然后它创建一个带有递归调用的列表标记.递归调用的局部视图将节点的子节点作为模型.最后,如果我们到达部分视图渲染的末尾,并且我们处于"根级别",它应该写一个结束<ul>标记
但是,有一些问题.首先,最后,关闭无序列表标记是错误的,VS无法找到匹配的开始标记.其次,我不知道为什么,但在顶部,我可以在标签之间放置起始<ul>标签,我不能在下面的结束标签处进行.但我也不确定这些<ul>标签,我觉得这些也是错的.

拜托,帮助我,我已经坚持了好几天了.

Answer 1

伙计,你有些不知所措.我觉得你被卡住的痛苦.

看看这是否漂浮在你的船上.

当您在同一列表上进行递归时,需要一个种子值来跟踪列表中的内容.最好在课堂上做一个父级子项映射,但是考虑到你的结构,这应该很有趣.

楷模

namespace trash.Models
{
    public class Category
    {
        public int ID { get; set; }
        public int? Parent_ID { get; set; }
        public string Name {get; set;}
    }

    public class SeededCategories
    {
        public int? Seed { get; set; }
        public IList<Category> Categories { get; set; }
    }
}

控制器(注意:你通过将Seed属性设置为null来启动递归链,这将获取所有空父项)

namespace trash.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            IList<trash.Models.Category> categories = new List<trash.Models.Category>();
            categories.Add(new trash.Models.Category { ID = 1, Parent_ID = null, Name = "Top1" });
            categories.Add(new trash.Models.Category { ID = 2, Parent_ID = null, Name = "Top2" });
            categories.Add(new trash.Models.Category { ID = 3, Parent_ID = 1, Name = "Top1Ring1" });
            categories.Add(new trash.Models.Category { ID = 4, Parent_ID = 1, Name = "Top1Ring2" });

            trash.Models.SeededCategories model = new Models.SeededCategories { Seed = null, Categories = categories };
            return View(model);
        }
    }
}

观点指数

@model trash.Models.SeededCategories

Here's a list
@Html.Partial("_TreeCategories", Model)

部分(您的_TreeCategories.注意:将Seed设置为当前节点ID和volia递归)

@model trash.Models.SeededCategories

@if (Model.Categories.Where(s => s.Parent_ID == Model.Seed).Any())
{
    <ul>
        @foreach (var node in Model.Categories)
        {
            if (node.Parent_ID == Model.Seed)
            {
                trash.Models.SeededCategories inner = new trash.Models.SeededCategories { Seed = node.ID, Categories = Model.Categories };
            <li><a href="?@node.ID">@node.Name</a>
                @Html.Partial("_TreeCategories", inner)
            </li>
            }
        }
    </ul>
}