Можно ли установить атрибут data- * с тимелеафом?
Как я понял из документации тимелеафа, я пробовал:
<div th:data-el_id="${element.getId()}"> <!-- doesn't work -->
<div data-th-el_id="${element.getId()}"> <!-- doesn't work -->
Можно ли установить атрибут data- * с тимелеафом?
Как я понял из документации тимелеафа, я пробовал:
<div th:data-el_id="${element.getId()}"> <!-- doesn't work -->
<div data-th-el_id="${element.getId()}"> <!-- doesn't work -->
Да, th:attr
на помощь Документация Thymeleaf - Настройка значений атрибутов.
Для вашего сценария это должно выполнить задание:
<div th:attr="data-el_id=${element.getId()}">
XML-правила не позволяют вам устанавливать атрибут дважды в теге, поэтому вы не можете иметь более одного th:attr
в том же элементе.
Примечание. Если вы хотите больше одного атрибута, разделите разные атрибуты запятой:
<div th:attr="data-id=${element.getId()},data-name=${element.getName()}">
Или вы можете использовать этот диалект Thymeleaf https://github.com/mxab/thymeleaf-extras-data-attribute, и вы сможете сделать
<div data:el_id="${element.getId()}">
В Thymeleaf 3.0 есть процессор атрибутов по умолчанию, который можно использовать для любых пользовательских атрибутов, например th:data-el_id=""
становится data-el_id=""
, th:ng-app=""
становится ng-app=""
и так далее. Больше нет необходимости в любимом диалекте атрибутов данных.
Это решение я предпочитаю, если я хочу использовать json в качестве значения вместо:
th:attr="data-foobar='{"foo":'+${bar}+'}'"
Вы можете использовать (в сочетании с буквенной заменой):
th:data-foobar='|{"foo":${bar}}|'
Обновление: если вам не нравится пространство имен th
, вы также можете использовать дружественные для HTML5 имена атрибутов и элементов, например data-th-data-foobar=""
.
Если кому-то интересно, то здесь можно найти соответствующие тесты движка шаблонов: Тесты для процессора атрибутов по умолчанию