在Asp.Net MVC中循环通过多级动态菜单

时间:2013-05-12 07:54:46

标签: c# asp.net asp.net-mvc loops asp.net-mvc-4

我正在尝试循环多级动态菜单。我已经成功地手动执行此操作,但每次如果要显示其父级的Menus,我必须手动循环。 我想知道通过这些动态菜单循环多层次的最佳方式或替代方法 这是我到目前为止所做的事情;

@{ var menusList = ViewBag.Menus as IEnumerable<ParentMenuViewModel>; }
@foreach (var parentMenu in menusList.Where(p => p.ParentId == 0))
{
    <ul>
        <li>
            <h1>@parentMenu.Name</h1>
            @if (menusList.Count(p => p.ParentId == parentMenu.MenuId) > 0)
            {
                <ul>
                    @foreach (var childMenu in menusList.Where(p => p.ParentId == parentMenu.MenuId))
                    {
                        <h2>@childMenu.Name</h2>
                        if (menusList.Count(p => p.ParentId == childMenu.MenuId) > 0)
                        {
                            foreach (var subChild in menusList.Where(p => p.ParentId == childMenu.MenuId))
                            {
                                <h3>@subChild.Name</h3>
                            }
                        }
                    }
                </ul>
            }
        </li>
    </ul>

}

更新:输出如下所示;

HOME
 SUB MENU1
  SUB SUB MENU1
  SUB SUB MENU2

但是,我的数据库中有这样的东西;

HOME
 SUB MENU1
  SUB SUB MENU1
  SUB SUB MENU2
    Sub SUB SUB MENU1
    Sub SUB SUB MENU2

这是我的模特;
enter image description here

1 个答案:

答案 0 :(得分:5)

您可以使用partialview然后执行递归循环。为此,您首先需要更改模型:

<强>视图模型

// The ViewModel is now a hirearchical model, where each item has a list of children.
public class MenuViewModel
{
    int MenuId {get; set;}
    string Name {get; set;}
    //other properties
    ** snip ** 
    List<MenuViewModel> Children {get; set;}
}

<强>控制器

将模型转换为分层ViewModel:

public ActionResult Menus(){
    List<Menu> menusource; // get your menus here
    ViewBag.Menus = CreateVM(0, menusource);  // transform it into the ViewModel
    return View();
}

public IEnumerable<MenuViewModel> CreateVM(int parentid, List<Menu> source)
{
    return from men in source
           where men.ParentId = parentid
           select new MenuViewModel(){
                      MenuId = men.MenuId, 
                      Name = men.Name
                      // other properties
                      Children = CreateVM(men.MenuId, source)
                  };
}

查看

@{ 
    var menusList = ViewBag.Menus as IEnumerable<MenuViewModel>; 
    Html.RenderPartial("MenuPartial", menuslist);
}

<强> MenuPartial

@model IEnumerable<MenuViewModel>

@foreach (var menuitem in model)
{
    <ul>
        <li>
            <h1>@menuitem.Name</h1>
            @{
                Html.RenderPartial("MenuPartial", menuitem.Children);
            }
        </li>
    </ul>
}

关于原始代码,这里唯一缺少的是你没有不同的Hx标签,但你可以通过创建另一个viewmodel并将其传递给你当前所处的级别来找到解决方法。

注意:我在SO编辑器中输入了所有这些代码,因此可能会出现一些小的语法错误。