2014-10-08 78 views
2

我想獲得在我的導航上顯示的活動類。我已經寫了的HtmlHelper:MVC 5剃刀導航主動CLass

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> 

導航不會去主動當我在說頁面。

+0

到底是什麼:這個HtmlHelper htmlHelper – JoshYates1980 2017-05-08 18:10:23

回答

5

這裏有幾件事情,我可以推薦:

  1. 你輸出的@Html.IsActive()結果爲<li>元素的屬性。我想你會想把它分配給元素的類屬性。

  2. 我會比較控制器和操作字符串使用不變的文化和忽略情況,以涵蓋可能的字符串,你想成功地匹配。

  3. 如果控制器和動作字符串與當前控制器和動作不匹配,我會從該方法返回null。如果返回null並將其分配給<li>元素的類屬性,則在標記中根本不會輸出class屬性。差別不大,但可能比空的類屬性更清潔。

  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字符串太多,如果你打算使用領域。

+0

非常感謝。 – TheDizzle 2014-10-08 04:17:28

+0

究竟是什麼:這個HtmlHelper htmlHelper – JoshYates1980 2017-05-08 18:09:00

+0

@ JoshYates1980 HtmlHelper上的擴展方法:https://docs.microsoft.com/en-us/dotnet/articles/csharp/programming-guide/classes-and-structs/extension-methods – 2017-05-08 21:14:33