首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >剃刀递归树菜单结构

问剃刀递归树菜单结构
EN

Stack Overflow用户
提问于 2013-03-22 16:20:21
回答 1查看 3.3K关注 0票数 4

我想我需要一点帮助来使用Razor视图引擎在Umbraco中渲染一个递归的树形菜单结构。

我需要渲染下面的树形菜单结构:

代码语言:javascript
复制
Page 1
     Page 2
         Page 3
         Page 4
              Page 5
     Page 6
     Page 7

因此,当我在Page 5上时,我需要在父节点上使用CSS类"open":Page 4、Page 2和Page 1,并在我所站的节点上使用CSS类"active"。

我已经获得了在单击菜单中的链接时呈现正确节点的结构,但我就是不知道如何应用正确的类:-(

我的代码如下:

代码语言:javascript
复制
@{
        DynamicNode current = Model;
        var nodes = Model.AncestorOrSelf(2).Children.Where("Visible");        
        if(nodes.Any())
        {
            <ul class="side-nav-list">
                @foreach(var node in nodes)
                {
                    bool isDescendantOrSelf = current.IsDescendantOrSelf(node);
                    <li>
                        <a href="@node.Url">@node.Name</a>
                        @if(isDescendantOrSelf)
                        {
                            @RenderSubMenuRecursive(node)
                        }
                    </li>
                }
            </ul>
        }
    }

@helper RenderSubMenuRecursive(DynamicNode node)
{
    if(node.Children.Any(x => x.GetPropertyValue("umbracoNaviHide").Equals("0") && Model.IsDescendantOrSelf(node)))
    {        
         var childNodes = node.Children.Where(x => x.GetPropertyValue("umbracoNaviHide").Equals("0"));
         string css = node.IsAncestor(Model) ? "open" : "";
         <ul>

            @foreach(var childNode in childNodes)
            {
                <li class="@css">                    
                    <a href="@childNode.Url">@childNode.Name</a>
                    @if (childNode.IsDescendantOrSelf(node))
                    {
                        @RenderSubMenuRecursive(childNode)
                    }
                </li>
            }
        </ul>
    }
}

在这方面的任何帮助/提示都是非常感谢的!:-)提前谢谢!

EN

回答 1

Stack Overflow用户

发布于 2013-03-22 16:56:32

我自己通过移动一些代码来解决它,等等。最终的解决方案:

代码语言:javascript
复制
 @{
        DynamicNode current = Model;
        var nodes = Model.AncestorOrSelf(2).Children.Where("Visible");        
        if(nodes.Any())
        {
            <ul class="side-nav-list">
                @foreach(var node in nodes)
                {                        
                    @RenderSubMenuRecursive(node)                                           
                }
            </ul>
        }
    }

@helper RenderSubMenuRecursive(DynamicNode node)
{    
    var childNodes = node.Children.Where(x => x.GetPropertyValue("umbracoNaviHide").Equals("0"));
string css = node.IsAncestor(Model) ? "open" : "";

if(node.Id == Model.Id)
{
    css = "active";
}

<li class="@css">
    <a href="@node.Url">@node.Name</a>

    <ul>            
        @foreach (var childNode in childNodes.Where(childNode => Model.IsDescendantOrSelf(node)))
        {
            @RenderSubMenuRecursive(childNode)
        }
    </ul>
</li>    
}
票数 9
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/15565709

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档