MVC 5 Razor Navigation Active CLASS

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

Там несколько вещей здесь, что я могу рекомендовать:

1. Вы вывода результата @Html.IsActive() в качестве атрибута на <li> элемента. Я думаю, вы хотите присвоить это атрибуту класса.

2. Я бы сравнил контроллер и строки действий с использованием инвариантной культуры и игнорировал случай, чтобы покрыть вероятные строки, которые вы хотите успешно сопоставить.

3. Я бы вернул null из метода в том случае, если контроллер и строки действий не соответствуют текущему контроллеру и действию. Если null возвращается и присваивается атрибуту класса элемента <li>, тогда атрибут класса не будет выводиться вообще в разметке. Небольшая разница, но, возможно, немного чище, чем пустой атрибут класса.

4. Я бы соответствовал порядку контроллера и действия в сигнатуре метода в порядке их появления в рамках методов структуры. Это будет более интуитивно понятным для других, чтобы использовать и менее запутывать в долгосрочной перспективе.

Таким образом, применяя все выше

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 строку тоже, если вы планируете использовать области.