Question

我有一个带导航菜单的网页。必须突出显示当前页面，这是通过添加css类来完成的。但是这个菜单是在布局页面中定义的，那么如何将该类添加到当前菜单项？

我能想到的唯一解决方案是为每个菜单项使用唯一的ViewBag属性，并使用它来从相应的Action方法中添加类。例如：

<div class="link @ViewBag.DashboardActive">
    @Html.ActionLink("Dashboard", "Index")
</div>
<div class="link @ViewBag.Item2Active">
    @Html.ActionLink("Item2", "Item2")
</div>

等

这可以胜任，但我觉得有更优雅的方法可以解决这个问题。

Answer 1

您可以编写一个自定义帮助程序，生成这些菜单并将CSS类应用于当前选定的项目。你躺下看看following example。这是一个使用锚点的similar。

Answer 2

如果您不想在每个操作中设置ViewBag属性，请使用@Html.RenderAction方法。

这是你的观点：

@{ Html.RenderAction("Menu", "MyController", new {selectedItem = "dashboard"}); }

这是您的菜单操作：

[HttpGet, ChildActionOnly]
public PartialViewResult Menu(string selectedItem)
{
    ViewBag.SelectedItem = selectedItem;
    return PartialView("Menu");
}

在我设置所选菜单项的项目中，我使用自定义操作过滤器属性，我将其应用于控制器/操作。

在razor布局文件中将css类添加到元素的最佳方法？

2 个答案: