ASP.NET MVC菜单选定项

Question

好的MVC新手.我之前问了这个问题并得到了答案,但我想知道是否有更简单的解决方案.

假设我有一个母版页面,菜单列为无序列表.我如何在当前所选菜单项上设置css类？

编辑:

当你启动一个新的mvc应用程序时,我正在使用菜单,因为它开箱即用

<ul id="menu">              
   <li><%: Html.ActionLink("Home", "Index", "Home")%></li>
   <li><%: Html.ActionLink("About", "About", "Home")%></li>
</ul>

Answer 1

Jakub Konecki的回答让我朝着正确的方向前进......这是我最终得到的控制器动作:

    [ChildActionOnly]
    public ActionResult MainMenu()
    {
        var items = new List<MenuItem>
        {
            new MenuItem{ Text = "Home", Action = "Index", Controller = "Home", Selected=false },
            new MenuItem{ Text = "My Profile", Action = "Index", Controller = "Profile", Selected = false},
            new MenuItem{ Text = "About", Action = "About", Controller = "Home", Selected = false }
        };

        string action = ControllerContext.ParentActionViewContext.RouteData.Values["action"].ToString();
        string controller = ControllerContext.ParentActionViewContext.RouteData.Values["controller"].ToString();

        foreach (var item in items)
        {
            if (item.Controller == controller && item.Action == action)
            {
                item.Selected = true;
            }
        }

        return PartialView(items);
    }

希望这有助于某人.

Answer 2

您应该传递模型中的所有相关信息.理想情况下,您的菜单将通过单独的控制器方法呈现为部分视图.我有一个导航控制器,其中包含MainMenu,FooterMenu,Breadcrumbs等操作,可以渲染单个部件.

您的模型将是以下菜单项的集合:

    public class MenuItemModel
    {
        public MenuItemModel()
        {
            SubMenu = new List<MenuItemModel>();
        }

        public string Text { get; set; }
        public string Controller { get; set; }            
        public string Action { get; set; }
        public bool Selected { get; set; }

        public List<MenuItemModel> SubMenu { get; private set; }
    }

您的控制器将创建一个菜单项集合,并将它们传递给视图,并选择相应的项目.那么视图可以很简单:

<ul id="menu">     
    <% foreach(var menuItem in Model.MenuItems) { %> 
        <li><%: Html.ActionLink(menuItem.Text, menuItem.Action, menuItem.Controller, null, new { @class = menuItem.Selected ? "selected" : "" })%></li>
    <% } %>
</ul>