Используя атрибут data- * с тимелеафом

Можно ли установить атрибут data- * с тимелеафом?

Как я понял из документации тимелеафа, я пробовал:

<div th:data-el_id="${element.getId()}"> <!-- doesn't work -->

<div data-th-el_id="${element.getId()}"> <!-- doesn't work -->

Ответ 1

Да, th:attr на помощь Документация Thymeleaf - Настройка значений атрибутов.

Для вашего сценария это должно выполнить задание:

<div th:attr="data-el_id=${element.getId()}">

XML-правила не позволяют вам устанавливать атрибут дважды в теге, поэтому вы не можете иметь более одного th:attr в том же элементе.

Примечание. Если вы хотите больше одного атрибута, разделите разные атрибуты запятой:

<div th:attr="data-id=${element.getId()},data-name=${element.getN‌​ame()}"> 

Ответ 3

В Thymeleaf 3.0 есть процессор атрибутов по умолчанию, который можно использовать для любых пользовательских атрибутов, например th:data-el_id="" становится data-el_id="", th:ng-app="" становится ng-app="" и так далее. Больше нет необходимости в любимом диалекте атрибутов данных.

Это решение я предпочитаю, если я хочу использовать json в качестве значения вместо:

th:attr="data-foobar='{&quot;foo&quot:'+${bar}+'}'"

Вы можете использовать (в сочетании с буквенной заменой):

th:data-foobar='|{"foo":${bar}}|'

Обновление: если вам не нравится пространство имен th, вы также можете использовать дружественные для HTML5 имена атрибутов и элементов, например data-th-data-foobar="".

Если кому-то интересно, то здесь можно найти соответствующие тесты движка шаблонов: Тесты для процессора атрибутов по умолчанию