Opérateur ternaire multiple Thymeleaf avec condition OU

Aug 20 2020

Avec Thymeleaf j'utilise ceci (ça marche bien):

<li class="drop-down" th:classappend="${#httpServletRequest.getRequestURI() == '/url1' ? 'active':''}"><a href="#">MainMenu</a>
<ul>
<li><a href="/url1" th:href="@{/url1}"><i
class="fas fa-users"></i> url1</a></li>
<li><a href="/url2" th:href="@{/url2}"><i
class="fas fa-users"></i> url2</a></li>
<li><a href="/url3" th:href="@{/url3}"><i
class="far fa-file-alt mr-1"></i> url3</a></li>
<li><a href="/url4" th:href="@{/url4}"><i
class="fas fa-sign-out-alt mr-1"></i>url4</a></li>
</ul></li>

Maintenant, je veux définir la classe active sur le menu principal si l'une des URL 1/2/3/4 est cliqué. J'ai donc essayé ceci (et cela n'a pas fonctionné):

<li class="drop-down" th:classappend="${#httpServletRequest.getRequestURI() == '/url1' ? 'active':'' :: '/url2' ? 'active':'' :: '/url3' ? 'active':'' :: '/url4' ? 'active':'' }"

J'ai aussi essayé beaucoup d'autres combinaisons avec "ou" et "||", rien n'a fonctionné. Toutes ces URL (chemins de contexte) sont totalement différentes et je NE PEUX PAS utiliser comme - contient. Je suis sûr que l'idée me manque, mais j'ai besoin d'aide ici. Veuillez suggérer.

Réponses

1 JakubCh. Aug 20 2020 at 18:33

Il semble que vous souhaitiez ajouter la activeclasse lorsque l'URI de la demande correspond à l'un des ensembles de valeurs fixes. Vous pouvez donc écrire votre <li>élément comme ceci :

<li
   class="drop-down"
   th:with="urls=${new String[]{'/url1','/url2','/url3','/url4'}}" th:classappend="${#arrays.contains(urls, #httpServletRequest.getRequestURI()) ? 'active' : ''}">

...où:

  • th:withdéclare un tableau nommé urlscontenant des URL qui déclenche l'ajout d'une classe.
  • th:classappendvérifie si le urlstableau contient une valeur renvoyée par #httpServletRequest.getRequestURI()et ajoute conditionnellement une classe.