Playframework является активным пунктом меню/маршрутом

Question

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

Любые предложения?

псевдокод:

<a #{routeIsActive Application.index()} class="active"#{/if} href="@{Application.index()}">My Page</a> 

Answer 1

К сожалению, я не смог найти простой способ сделать это. Самое простое решение, которое я мог найти, - написать быстрый тег (но это может быть связано с отсутствием опыта Groovy).

Я получил эту работу с этим кодом.

На ваш взгляд

<a class="#{activeRoute href:@Application.index(), activeClass:'active' /}" href="@{Application.index()}">My Page</a> 

Затем создайте новый FastTag для activeRoute

public class MyFastTag extends FastTags { 

    public static void _activeRoute(Map<?, ?> args, Closure body, PrintWriter out, GroovyTemplate.ExecutableTemplate template, int fromLine) { 
     Router.ActionDefinition actionDef = (Router.ActionDefinition) args.get("href"); 
     String activeStyle = (String) args.get("activeClass"); 
     String inactiveStyle = (String) args.get("inactiveClass"); 

     if (Http.Request.current().action.equals(actionDef.action) && activeStyle != null) { 
     out.print(activeStyle); 
     } 
     else if (!Http.Request.current().action.equals(actionDef.action) && inactiveStyle != null) { 
     out.print(inactiveStyle); 
     } 
    } 
} 

Убедитесь, что вы добавить соответствующие импорт.

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

Answer 2

Это решение работало очень хорошо для меня. Это может быть очень простым.

приложение/просмотров/теги/navigationitem.js

%{ 
boolean isMatch = request.path.startsWith(_href.toString()); 
}% 
<li class="sliding-element"> 
#{if isMatch} 
<h3>${_title}</h3> 
#{/if} 
#{else} 
<a href="${_href}">${_title}</a> 
#{/else} 
</li> 

приложение/просмотров/теги/navigationmenu.js

#{js 'navigationmenu.js'/} 
#{css 'navigationmenu.css'/} 

<div id="navigation-block"> 
    <ul id="sliding-navigation"> 
     #{navigationitem title:'Home', href:@HomeController.index() /} 
     #{navigationitem title:'Search Contact', href:@SearchByContactController.index() /} 
     #{navigationitem title:'Edit Contact', href:@EditContactInfoController.index() /} 
    </ul> 
</div> 

Answer 3

<a #{if request.action=="Application.index"}class="active"#{/if} href="@{Application.index()}">My Page</a> 

Easy. : D

Answer 4

Этот код работает для меня ребята

<li @if(request.path.startsWith("/artigo")){ class="active" }> 
    <a href="@routes.ArtigoController.telaLista"> Artigos</a> 
</li>