Question

我正在尝试让我的导航显示活动课程。我写了htmlhelper：

public static string IsActive(this HtmlHelper htmlHelper, string controller, string action)
    {
        var routeData = htmlHelper.ViewContext.RouteData;

        var routeAction = routeData.Values["action"].ToString();
        var routeController = routeData.Values["controller"].ToString();

        var returnActive = (controller == routeController && action == routeAction);

        return returnActive ? "active" : "";
    }

这是我的导航：

<li @Html.IsActive("MemberDashboard", "Index")><a href="@Url.Action("Index", "MemberDashboard")"><span class="fa fa-list-alt fa-lg fa-fw"></span> Accounts</a></li>
 <li @Html.IsActive("Transfer", "Index")><a href="@Url.Action("Index", "Transfer")"><span class="fa fa-retweet fa-lg fa-fw"></span> Transfers</a></li>

当我在页面上时，导航不会激活。

Answer 1

我可以推荐一些事情：

您正在输出@Html.IsActive()的结果作为<li>元素的属性。我想你想把它分配给元素的类属性。
我会使用不变文化比较控制器和操作字符串，并忽略大小写以覆盖您想要成功匹配的可能字符串。
如果控制器和操作字符串与当前控制器和操作不匹配，我将从方法返回null。如果返回null并将其分配给<li>元素的class属性，则标记中根本不会输出class属性。差别很小，但可能比空类属性更清晰。
我会将方法签名中的控制器和操作的顺序与它们在框架方法中出现的顺序相匹配。对于其他人来说，这将更直观，并且从长远来看也不会造成混淆。

所以，应用以上所有

public static string IsActive(this HtmlHelper htmlHelper, string action, string controller)
{
    var routeData = htmlHelper.ViewContext.RouteData;

    var routeAction = (string)routeData.Values["action"];
    var routeController = (string)routeData.Values["controller"];

    var isActive = string.Equals(controller, routeController, StringComparison.InvariantCultureIgnoreCase)
                   && string.Equals(action, routeAction, StringComparison.InvariantCultureIgnoreCase);

    return isActive ? "active" : null;
}

和用法

<li class="@(Html.IsActive("Index", "MemberDashboard"))">
    <a href="@Url.Action("Index", "MemberDashboard")">
        <span class="fa fa-list-alt fa-lg fa-fw"></span> Accounts
    </a>
</li>
<li class="@(Html.IsActive("Index", "Transfer"))">
    <a href="@Url.Action("Index", "Transfer")">
        <span class="fa fa-retweet fa-lg fa-fw"></span> Transfers
    </a>
</li>

如果您计划使用区域，也可能还需要包含area字符串。

MVC 5 Razor Navigation Active CLass

1 个答案: