我在mvc中创建了多级菜单。它的工作原理,但我想要无限次数。现在有4个级别,所以将来如果有人想在数据库中添加5.级别,它将不会显示在我的菜单中。我需要添加另一个foreach循环来显示5. level。那么如何让我的菜单无限制?
这是我的菜单视图。
@{
var myMenu = @Model;
var navbarmenu = myMenu.Where(x => x.ParentID == null);
var i = 0;
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class=" nav navbar-nav">
@foreach (var menuLevel1 in navbarmenu)
{
<li class="dropdown">
<a href="~/ADDS/Default.aspx" style="font-size:16px;">
@menuLevel1.MenuName
@if (menuLevel1.MenuName != "Home")
{
<span class="caret"></span>
}
</a>
@{ var navbarsubmenu = myMenu.Where(x => x.ParentID == menuLevel1.MenuID);}
@if (navbarsubmenu.IsAny())
{
<ul class="dropdown-menu">
@foreach (var menuLevel2 in navbarsubmenu)
{
<li class="dropdown-submenu">
@if (!string.IsNullOrEmpty(menuLevel2.MenuLink))
{
<a href="@Url.Content(menuLevel2.MenuLink)">
@menuLevel2.MenuName
</a>
}
else
{
<a href="~/ADDS/Default.aspx">
@menuLevel2.MenuName
</a>
}
@{var navbarsubmenu2 = myMenu.Where(x => x.ParentID == menuLevel2.MenuID);}
@if (navbarsubmenu2.IsAny())
{
<ul class="dropdown-menu">
@foreach (var menuLevel3 in navbarsubmenu2)
{
<li class="dropdown-submenu">
@if (!string.IsNullOrEmpty(menuLevel3.MenuLink))
{
<a href="@Url.Content(menuLevel3.MenuLink)">
@menuLevel3.MenuName
</a>
}
else
{
<a href="~/ADDS/Default.aspx">
@menuLevel3.MenuName
</a>
}
@{var navbarsubmenu3 = myMenu.Where(x => x.ParentID == menuLevel3.MenuID);}
@if (navbarsubmenu3.IsAny())
{
<ul class="dropdown-menu">
@foreach (var menuLevel4 in navbarsubmenu3)
{
<li class="dropdown-submenu">
@if (!string.IsNullOrEmpty(menuLevel4.MenuLink))
{
<a href="@Url.Content(menuLevel4.MenuLink)">
@menuLevel4.MenuName
</a>
}
else
{
<a href="~/ADDS/Default.aspx">
@menuLevel4.MenuName
</a>
}
</li>
}
</ul>
}
</li>
}
</ul>
}
</li>
}
</ul>
}
</li>
}
</ul>
</div>
</div>
</nav>
}
答案 0 :(得分:3)
我会创建一个MultiLevelMenu模型,该模型将由服务层中的数据库填充,然后您可以使用部分视图。
public class MultiLevelMenu
{
public string MenuName { get; set; }
public MultiLevelMenu NestedMenu { get; set; }
}
然后在主视图中有:
@model MultiLevelMenu;
<div>@Model.MenuName</div>
@Html.Partial("_MultiLevelMenu", Model);
然后是局部视图:
@if (Model.MultiLevelMenu != null)
{
<div>@Model.MenuName</div>
@Html.Partial("_MultiLevelMenu", Model);
}
答案 1 :(得分:2)
您是否考虑过在视图中尝试辅助方法?使用递归的更多内容是什么?
@helper GetSubMenus(IEnumerable<menutable> siteMenu, Nullable<int> parentID)
{
foreach (var i in Model.Where(a => a.ParentID.Equals(parentID)))
{
var submenu = Model.Where(a => a.ParentID.Equals(i.MenuID)).Count();
<li class="@(submenu > 0 ? "dropdown-submenu" : "dropdown")">
<a href="@(!string.IsNullOrEmpty(i.MenuLink) ? Url.Content(i.MenuLink) : "~/default)" style="font-size:16px;">@i.MenuName</a>
@if (submenu > 0)
{
<ul class="dropdown-menu">
@GetSubMenus(siteMenu, i.MenuID)
@* Recursive Call for Populate Sub items here*@
</ul>
}
</li>
}
}
@{
var mymenu = @Model;
var menuParentID = mymenu.First().ParentID;
}
@if (mymenu != null && mymenu.Count() > 0)
{
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class=" nav navbar-nav">
@GetSubMenus(mymenu, menuParentID)
</ul>
</div>
</div>
</nav>
}