MvcSiteMapProvider - 增强的 bootstrap 下拉菜单
MvcSiteMapProvider - Enhanced bootstrap dropdown menu
我正在尝试构建这样的菜单:
作为参考,我正在使用这个库
https://github.com/behigh/bootstrap_dropdowns_enhancement
@Html.MvcSiteMap().Menu("BootstrapMenuHelperModel")
@model MenuHelperModel
<nav class="navbar" role="navigation">
<div class="container-fluid menu-container">
<div class="collapse navbar-collapse">
<div class="navbar-header">
<span class="navbar-brand">FAR BACKOFFICE</span>
</div>
<ul class="nav nav-pills">
@foreach (var node in Model.Nodes)
{
if (node.Descendants.Any())
{
<li role="presentation" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">@node.Title <span class="caret"></span></a>
<ul class="dropdown-menu">
@foreach (var descendant in node.Descendants)
{
if (descendant.Descendants.Any())
{
<li role="presentation" class="dropdown-submenu">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">@descendant.Title</a>
<ul class="dropdown-menu">
@foreach (var descendant2 in descendant.Descendants)
{
<li role="presentation">@Html.ActionLink(descendant2.Title, descendant2.Action, descendant2.Controller)</li>
}
</ul>
</li>
}
else
{
<li role="presentation">@Html.ActionLink(descendant.Title, descendant.Action, descendant.Controller)</li>
}
}
</ul>
</li>
}
else
{
<li role="presentation">@Html.ActionLink(node.Title, node.Action, node.Controller)</li>
}
}
</ul>
</div>
</div>
</nav>
我的控制器
[MvcSiteMapNode(Title = "Assembleia", ParentKey = "Home", Key = "Assembleia", Clickable = false, Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public class AssembleiaController : Controller { }
[Route("Assembleia/Comunicado")]
[MvcSiteMapNode(Title = "Comunicado", ParentKey = "Assembleia", Key = "AssembleiaComunicado", Clickable = false, Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public class AssembleiaComunicadoController : AssembleiaController
{
[Route("Assembleia/Comunicado/Enviar")]
[MvcSiteMapNode(Title = "Enviar", ParentKey = "AssembleiaComunicado", Key = "AssembleiaComunicadoEnviar", Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public ActionResult Enviar()
{
return View();
}
[HttpGet]
[Route("Assembleia/Comunicado/Consultar")]
[MvcSiteMapNode(Title = "Consultar", ParentKey = "AssembleiaComunicado", Key = "AssembleiaComunicadoConsultar", Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public ActionResult Consultar()
{
return View();
}
}
因此,我出现了一种奇怪且无法理解的行为
怎么了?
也在 GitHub
上询问
node.Descendants
应该是 node.Children
在此处了解 Descendants 和 Children 的区别,CSS Child vs Descendant selectors(不要介意 post 关于 CSS 的蜂鸣,这是一个通用模式)
我正在尝试构建这样的菜单:
作为参考,我正在使用这个库 https://github.com/behigh/bootstrap_dropdowns_enhancement
@Html.MvcSiteMap().Menu("BootstrapMenuHelperModel")
@model MenuHelperModel
<nav class="navbar" role="navigation">
<div class="container-fluid menu-container">
<div class="collapse navbar-collapse">
<div class="navbar-header">
<span class="navbar-brand">FAR BACKOFFICE</span>
</div>
<ul class="nav nav-pills">
@foreach (var node in Model.Nodes)
{
if (node.Descendants.Any())
{
<li role="presentation" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">@node.Title <span class="caret"></span></a>
<ul class="dropdown-menu">
@foreach (var descendant in node.Descendants)
{
if (descendant.Descendants.Any())
{
<li role="presentation" class="dropdown-submenu">
<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-expanded="false">@descendant.Title</a>
<ul class="dropdown-menu">
@foreach (var descendant2 in descendant.Descendants)
{
<li role="presentation">@Html.ActionLink(descendant2.Title, descendant2.Action, descendant2.Controller)</li>
}
</ul>
</li>
}
else
{
<li role="presentation">@Html.ActionLink(descendant.Title, descendant.Action, descendant.Controller)</li>
}
}
</ul>
</li>
}
else
{
<li role="presentation">@Html.ActionLink(node.Title, node.Action, node.Controller)</li>
}
}
</ul>
</div>
</div>
</nav>
我的控制器
[MvcSiteMapNode(Title = "Assembleia", ParentKey = "Home", Key = "Assembleia", Clickable = false, Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public class AssembleiaController : Controller { }
[Route("Assembleia/Comunicado")]
[MvcSiteMapNode(Title = "Comunicado", ParentKey = "Assembleia", Key = "AssembleiaComunicado", Clickable = false, Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public class AssembleiaComunicadoController : AssembleiaController
{
[Route("Assembleia/Comunicado/Enviar")]
[MvcSiteMapNode(Title = "Enviar", ParentKey = "AssembleiaComunicado", Key = "AssembleiaComunicadoEnviar", Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public ActionResult Enviar()
{
return View();
}
[HttpGet]
[Route("Assembleia/Comunicado/Consultar")]
[MvcSiteMapNode(Title = "Consultar", ParentKey = "AssembleiaComunicado", Key = "AssembleiaComunicadoConsultar", Attributes = @"{ ""visibility"": ""SiteMapPathHelper,MenuHelper,!*"" }")]
public ActionResult Consultar()
{
return View();
}
}
因此,我出现了一种奇怪且无法理解的行为
怎么了?
也在 GitHub
上询问node.Descendants
应该是 node.Children
在此处了解 Descendants 和 Children 的区别,CSS Child vs Descendant selectors(不要介意 post 关于 CSS 的蜂鸣,这是一个通用模式)