Thymeleaf: как использовать условные выражения для динамического добавления/удаления класса CSS

Используя Thymeleaf в качестве механизма шаблона, можно ли динамически добавлять/удалять класс CSS в/из простой div с предложением th:if?

Обычно я могу использовать условное предложение следующим образом:

<a href="lorem-ipsum.html" th:if="${condition}">Lorem Ipsum</a>

Мы создадим ссылку на страницу lorem ipsum, но только если условие условия истинно.

Я ищу что-то другое: я бы хотел, чтобы блок всегда был виден, но с переменными классами в зависимости от ситуации.

Ответы

Ответ 1

Существует также th:classappend.

<a href="" class="baseclass" th:classappend="${isAdmin} ? adminclass : userclass"></a>

Если isAdmin - true, это приведет к:

<a href="" class="baseclass adminclass"></a>

Ответ 2

Да, динамически можно изменить класс CSS в соответствии с ситуацией, но не с th:if. Это делается с помощью elvis operator.

<a href="lorem-ipsum.html" th:class="${isAdmin}? adminclass : userclass">Lorem Ipsum</a>

Ответ 3

Для этой цели, и если у меня нет логической переменной, я использую следующее:

<li th:class="${#strings.contains(content.language,'CZ')} ? active : ''">

Ответ 4

Другой очень похожий ответ - использовать "equals" вместо "contains".

<li th:class="${#strings.equals(pageTitle,'How It Works')} ? active : ''">

Ответ 5

Просто добавьте мое собственное мнение, если это может быть полезно кому-то. Это то, что я использовал.

<div th:class="${request.read ? 'mdl-color-text--grey-800 w500' : ''}"> </div>

Ответ 6

Еще одно использование класса th: class, такое же, как @NewbLeech и @Charles, опубликовано, но упрощено до максимального, если нет случая "else":

<input th:class="${#fields.hasErrors('password')} ? formFieldHasError" />

Не включает атрибут класса, если # fields.hasErrors('password') является ложным.