Question

我的网站上有一个侧边菜单，目前是一系列列表项：

<ul>
    <li>...</li>
    <li>...</li>
    <li>...</li>
</ul>

现在我需要将其更改为具有子项目，以便呈现...

<ul>
    <li>
        <ul>
            <li>...</li>
            <li>...</li>
        </ul>
    </li>
    <li>...</li>
    <li>...</li>
</ul>

我有一个像这样的项目列表：

    /// <summary>
    /// Gets the admin menu items.
    /// </summary>
    /// <returns></returns>
    public IQueryable<IAdminMenuItem> GetAdminMenuItems()
    {
        return new List<IAdminMenuItem> {              
            new AdminMenuItem {MenuItemId = "100", DisplayText = "xxx", ParentId = "" ControllerName = "xxx", ActionName = "xxx"},
            new AdminMenuItem {MenuItemId = "101", DisplayText = "xxx", ParentId = "100" ControllerName = "xxx", ActionName = "xxx"},
            new AdminMenuItem {MenuItemId = "102", DisplayText = "xxx", ParentId = "100" ControllerName = "xxx", ActionName = "xxx"},
            new AdminMenuItem {MenuItemId = "200", DisplayText = "xxx", ParentId = "" ControllerName = "xxx", ActionName = "xxx"},
            new AdminMenuItem {MenuItemId = "201", DisplayText = "xxx", ParentId = "200" ControllerName = "xxx", ActionName = "xxx"},
            new AdminMenuItem {MenuItemId = "202", DisplayText = "xxx", ParentId = "200" ControllerName = "xxx", ActionName = "xxx"},
        }.AsQueryable();

如果列表项没有ParentID，那么它是顶级元素。如果是，则它是子项元素。

我目前已经有了这个代码来应对平面菜单结构：

<ul>
    @foreach (Avelo.Exchange.WebUI.Domain.Interfaces.IAdminMenuItem item in Model){
       <li><a href="@Url.Action(item.ActionName, item.ControllerName)"><span>@item.DisplayText</span></a></li>
    }
</ul>

我想我的第一个问题是我如何处理视图中的子菜单项，但我还希望通过它能够处理更多子级别（即三级而不是两级）来解决该解决方案。。我听说过递归循环，但不知道如何实现它。这是一个好方法吗？

提前致谢

取值

Answer 1

前段时间我遇到过类似的问题。我会尝试使我的解决方案适应您的模型。我想你有这样的事情：

public interface IAdminMenuItem
{
    string MenuItemId { get; set; }
    string DisplayText { get; set; }
    string ControllerName { get; set; }
    string ActionName { get; set; }
    List<IAdminMenuItem> Children { get; set; }
}

public class AdminMenuItem: IAdminMenuItem
{
    public string MenuItemId { get; set; }
    public string DisplayText { get; set; }
    public string ControllerName { get; set; }
    public string ActionName { get; set; }
    public List<IAdminMenuItem> Children { get; set; }
}

正如您所看到的，我已经更改了您的属性ParentId，其中包含一系列子项，因此更容易管理。

在您的视图中，您将填充菜单（以及所有子菜单）并将其传递给视图：

List<IAdminMenuItem> myMenu = new List<IAdminMenuItem>();

myMenu.Add(new AdminMenuItem()
    {
    MenuItemId = "100",
    DisplayText = "Level 1",
    ControllerName = "Home",
    ActionName = "Index",
    Children = new List<IAdminMenuItem>() { 
        new AdminMenuItem() { MenuItemId = "1001", DisplayText = "Level 1a", ControllerName = "Home", ActionName = "Index" },
        new AdminMenuItem() { MenuItemId = "1002", DisplayText = "Level 1b", ControllerName = "Home", ActionName = "Index" }
    }
});

myMenu.Add(new AdminMenuItem()
    {
    MenuItemId = "200",
    DisplayText = "Level 2",
    ControllerName = "Home",
    ActionName = "Index",
    Children = new List<IAdminMenuItem>() { 
        new AdminMenuItem() { MenuItemId = "2001", DisplayText = "Level 2a", ControllerName = "Home", ActionName = "Index" },
        new AdminMenuItem() { MenuItemId = "2002", DisplayText = "Level 2b", ControllerName = "Home", ActionName = "Index" }
    }
});

return View(myMenu);

这是我的看法。这里没有多少。

@using Mvc3SubMenus.WebUI
@model List<Mvc3SubMenus.IAdminMenuItem>
@{
    ViewBag.Title = "Home Page";
}

@Html.BuildMenu(Model)

我创建了一个帮助器，负责创建菜单和所有子菜单（带递归）：

using System.Collections.Generic;
using System.Web.Mvc;
using System.Text;
using System.Web.Mvc.Html;

namespace Mvc3SubMenus.WebUI
{
    public static class MyHelpers
    {
        public static System.Web.Mvc.MvcHtmlString BuildMenu(this HtmlHelper helper, List<Mvc3SubMenus.IAdminMenuItem> menu)
        {
            return new MvcHtmlString(BuildStringMenu(helper, menu));
        }

        private static string BuildStringMenu(HtmlHelper helper, List<Mvc3SubMenus.IAdminMenuItem> menu)
        {
            var sb = new StringBuilder();
            if ((menu != null) && (menu.Count > 0))
            {
                sb.Append("<ul>");
                foreach (var item in menu)
                {
                    sb.Append("<li>");
                    sb.Append(helper.ActionLink(item.DisplayText, item.ActionName, item.ControllerName));
                    sb.Append("</li>");
                    if ((item.Children != null) && (item.Children.Count > 0))
                    {
                        sb.Append("<li>");
                        sb.Append(BuildStringMenu(helper, item.Children));
                        sb.Append("</li>");
                    }
                }
                sb.Append("</ul>");
            }
            return (sb.ToString());
        }
    }
}

这个助手可以得到改善，当然有人可能会反对它可以以更好的方式完成，但我没有太多时间来完善它。对不起。
您可以找到一些代码here。该项目名为 Mvc3SubMenus 。

在列表MVC 3上递归循环

1 个答案: