MvcSiteMap에서 빵집을 엉망으로 만들지 않고 메뉴를 생성

Question

MvcSiteMap 라이브러리를 사용하기 위해 asp.net mvc 5 앱을 구성하고 있습니다. 그래서, 나는 breadcumb을 성공적으로 구성 할 수있었습니다.
그러나 메뉴 템플릿은 breadcumbs보다 다소 복잡합니다. 나는 메뉴의 수염 버전이 (필자는 UL 태그를 보여주지 않았다) :

<li{{#class}} class="{{class}}" {{ />class}}>{{! print class name (active, open, etc) if it exists }} 
<a href="{{#link}}{{#createLinkFunction}}{{link}}{{/createLinkFunction}}{{/link}} {{^link}}#{{/link}}" {{#submenu?}} class="dropdown-toggle" {{ />submenu?}}> 
{{#icon}}<i class="{{icon}}"></i>{{/icon}} 
{{#level-1}} 
<span class="menu-text"> 
{{/level-1}} 

{{#level-2}}{{! if level-2 and no icon assigned, use this icon}} 
{{^icon}}<i class="icon-double-angle-right"></i>{{/icon}} 
{{/level-2}} 

{{title}} 
{{#badge}} 
<span class="badge {{badge-class}} {{tooltip-class}}" {{#tooltip}} title="{{{tooltip}}}" {{ />tooltip}}>{{{badge}}} 
</span> 
    {{/badge}} 
    {{#label}} 
<span class="label {{label-class}}" {{#label-title}} title="{{label-title}}" {{ />label-title}}>{{{label}}}</span> 
    {{/label}} 
{{#level-1}} 
</span> 
{{/level-1}} 

{{#submenu?}}<b class="arrow icon-angle-down"></b>{{/submenu?}} 
</a> 

{{#submenu?}}{{! if we have submenu items, print them recursively }} 
<ul class="submenu"> 
{{#submenu}} 
{{> layout.sidenav.items}} 
{{/submenu}} 
</ul> 
{{/submenu?}} 
</li> 

그래서, 모든 노드에 대해이 적용되는 논리이다. 레벨 1 또는 레벨 2 노드 인 경우 노드에 하위 노드 (하위 메뉴)가 있는지 알아야합니다.
1) 어떻게 알 수 있습니까?
2) 변경해야 할 것으로 생각되는 SiteMapNodeModel.cshtml을 변경해야하는 경우, 동일한 템플릿을 사용하므로 breadcumbs를 망치지 않는 방법은 무엇입니까?

Answer 1

MenuHelperModel에 대한 템플릿을 만들고 사용자 정의 이름을 지정하고 /Views/Shared/DisplayTemplates/ 폴더에 넣습니다. 그런 다음 SiteMapNodeModel 및 SiteMapNodeModelList에 대한 템플릿을 만들어 사용자 정의 이름을 지정할 수 있습니다. MenuHelperModel.cshtml, SiteMapNodeModel.cshtml 및 SiteMapNodeModelList.cshtml의 내용을 새 사용자 지정 도우미에 복사하십시오.

그런 다음 템플릿의 각 HTML 도우미에서 재정의를 변경하여 기본 제공 템플릿 대신 사용자 지정 템플릿을 호출합니다.

// MyMenu.cshtml 
@* // This template is for the root level *@ 
@model MvcSiteMapProvider.Web.Html.Models.MenuHelperModel 
@using System.Web.Mvc.Html 
@using MvcSiteMapProvider.Web.Html.Models 

<ul id="menu"> 
    @foreach (var node in Model.Nodes) { 
     <li>@Html.DisplayFor(m => node, "MyMenuNode") @* <-- // Custom Node Helper Name *@ 
      @if (node.Children.Any()) { 
       @Html.DisplayFor(m => node.Children, "MyMenuNodeList") @* <-- // Custom Node Helper Name *@ 
      } 
     </li> 
    } 
</ul> 


// MyMenuNodeList.cshtml 
@* // This template is for the descendent lists below the root level *@ 
@model MvcSiteMapProvider.Web.Html.Models.SiteMapNodeModelList 
@using System.Web.Mvc.Html 
@using MvcSiteMapProvider.Web.Html.Models 

<ul> 
    @foreach (var node in Model) { 
     <li>@Html.DisplayFor(m => node, "MyMenuNode") @* <-- // Custom Node Helper Name *@ 
      @if (node.Children.Any()) { 
       @Html.DisplayFor(m => node.Children, "MyMenuNodeList") @* <-- // Custom Node Helper Name *@ 
      } 
     </li> 
    } 
</ul> 



// MyMenuNode.cshtml 
@* // This template is for the node *@ 
@model MvcSiteMapProvider.Web.Html.Models.SiteMapNodeModel 
@using System.Web.Mvc.Html 
@using MvcSiteMapProvider.Web.Html.Models 

Testing @* <-- // If configured right, Testing will appear before every node *@ 

@if (Model.IsCurrentNode && Model.SourceMetadata["HtmlHelper"].ToString() != "MvcSiteMapProvider.Web.Html.MenuHelper") { 
    <text>@Model.Title</text> 
} else if (Model.IsClickable) { 
    if (string.IsNullOrEmpty(Model.Description)) 
    { 
     <a href="@Model.Url">@Model.Title</a> 
    } 
    else 
    { 
     <a href="@Model.Url" title="@Model.Description">@Model.Title</a> 
    } 
} else { 
    <text>@Model.Title</text> 
} 

그런 다음 메뉴에서 루트 템플릿을 호출하십시오.

@Html.MvcSiteMap().Menu("MyMenu") 

이것을 시작점으로 사용하여 원하는대로 HTML을 출력하도록 뷰를 변경할 수 있습니다.

SiteMapNodeListHelper 템플릿 (이 경우 "MySiteMapNodeList")은 노드의 각 연속 레벨에 대해 재귀 적으로 자신을 호출합니다.