2016-07-14 13 views
0

は、これは私が、基本クラスブロックをタグ内に入れてクラスを変更するにはどうすればよいですか?

<ul class="nav navbar-nav side-nav"> 
    <li> 
     <a href="#" th:href="@{/home}">Home</a> 
    </li> 

    <li class="active"> 
     <a href="#" th:href="@{/page}">My Page</a> 
    </li> 
</ul>  

class="active"に持っているものであるサイド・ナビゲーション・バーは、ユーザーがオンになっている適切なタブを強調表示しますクラスです。私はこれを手動で各ページで行っていますが、私はThymeleafと知っています。基本クラスを持ち、ページ上で変更したいものにタグを付けるだけで新しいコンテンツに置き換えることができます。私はちょうどclass="active"のための単語activeを交換するためにこれは私がこれまで持っていたものである

...

page.html

<ul class="nav navbar-nav side-nav" th:fragment="active"> 
    <li class="active"> 
     <a href="#" th:href="@{/page}">My Page</a> 
    </li> 
</ul> 

base.html

<ul class="nav navbar-nav side-nav"> 
    <li> 
     <a href="#" th:href="@{/home}">Home</a> 
    </li> 

    <li th:include="this :: active"> 
     <a href="#" th:href="@{/page}">My Page</a> 
    </li> 
</ul> 
しかし、私の質問は..ですが、それは可能です <li>タグの?事前に

感謝:)

答えて

0

あなたはこれを試してみて、これがあなたのために働いていた場合

基底クラス

<ul class="nav navbar-nav side-nav"> 
    <li> 
     <a href="#" th:href="@{/home}">Home</a> 
    </li> 

    <li th:classappend="${#httpServletRequest.getRequestURI() == '/page' ? 'active':''}"> 
     <a href="#" th:href="@{/page}">My Page</a> 
    </li> 
    <li th:classappend="${#httpServletRequest.getRequestURI() == '/otherpage' ? 'active':''}"> 
     <a href="#" th:href="@{/otherpage}">My Other Page</a> 
    </li> 
</ul> 

とpage.htmlでは、アクティブクラスに

<ul class="nav navbar-nav side-nav" th:fragment="active"> 
     <a href="#" th:href="@{/page}">My Page</a> 
</ul> 
を削除伝えることができます
+0

こんにちは返信いただきありがとうございます:)それはうまくいきませんでした。タブをクリックすることはできますが、生成されたHTMLには – JoePear

+0

がハイライト表示されません

  • My Page
  • +0

    また、ページ 'ページ'に移動すると、呼び出されるリクエストURIは何ですか? –

    関連する問題