基于上下文数据显示活动导航

navigation jsp java spring thymeleaf

2022-09-01 13:28:04

我在百里香叶模板中有以下分离的片段。

<ul class="nav nav-tabs">
    <li role="presentation"><a href="/">Freight Invoices</a></li>
    <li role="presentation"><a href="/processed">Processed Invoices</a></li>
    <li role="presentation"><a href="/postingrules">Posting Rules</a></li>
    <li role="presentation" class="active"><a href="/settings">Settings</a></li>
</ul>

我想为活动导航元素添加一个“活动”类 - 但在Thymyleaf中似乎很难实现。有什么建议吗？

答案 1

您可以执行以下操作：

<ul class="nav navbar-nav">
    <li th:classappend="${#httpServletRequest.getRequestURI() == '/dashboard' ? 'active':''}"><a th:href="@{/dashboard}"><span>Dashboard</span></a></li>
    <li th:classappend="${#httpServletRequest.getRequestURI() == '/orders' ? 'active':''}"><a th:href="@{/orders}"><span>Orders</span></a></li>
    <li th:classappend="${#httpServletRequest.getRequestURI() == '/income' ? 'active':''}"><a th:href="@{/income}"><span>Income</span></a></li>
    <li role="separator" ></li>
</ul>

答案 2

虽然我认为这是丑陋的解决方案，而且很遗憾百里香叶没有一些宏，但你可以使用：

<li th:classappend="${#httpServletRequest.getRequestURI().startsWith('/hotels') ? 'active':''}">
    Hotel
</li>

它也适用于“更深层次”的链接，如/hotels/new，因此它也可用于多级菜单。