我可以用Thymeleaf设置data-* 属性吗?正如我从Thymeleaf文档中了解到的那样,我尝试了:
<div th:data-el_id="${element.getId()}"> <!-- doesn't work --> <div data-th-el_id="${element.getId()}"> <!-- doesn't work -->
a14dhokn1#
是的,th:attr来拯救Thymeleaf文档-设置属性值。对于您的场景,这应该可以完成任务:
th:attr
<div th:attr="data-el_id=${element.getId()}">
XML规则不允许在一个标记中设置一个属性两次,因此在同一个元素中不能有多个th:attr。注意:如果需要多个属性,请用逗号分隔不同的属性:
<div th:attr="data-id=${element.getId()},data-name=${element.getName()}">
yhxst69z2#
Thymeleaf 3.0提供了默认属性处理器,可以用于任何类型的自定义属性,例如,th:data-el_id=""变成data-el_id="",th:ng-app=""变成ng-app=""等等。不再需要受欢迎的数据属性方言。这个解决方案我更喜欢,如果我想用json作为值,而不是:
th:data-el_id=""
data-el_id=""
th:ng-app=""
ng-app=""
th:attr="data-foobar='{"foo":'+${bar}+'}'"
您可以使用(与文字替换结合使用):
th:data-foobar='|{"foo":${bar}}|'
**更新:**如果您不喜欢th名称空间,您也可以使用HTML5友好的属性和元素名称,如data-th-data-foobar=""。
th
data-th-data-foobar=""
uelo1irk3#
或者你可以用Thymeleaf方言https://github.com/mxab/thymeleaf-extras-data-attribute
<div data:el_id="${element.getId()}">
3条答案
按热度按时间a14dhokn1#
是的,
th:attr
来拯救Thymeleaf文档-设置属性值。对于您的场景,这应该可以完成任务:
XML规则不允许在一个标记中设置一个属性两次,因此在同一个元素中不能有多个
th:attr
。注意:如果需要多个属性,请用逗号分隔不同的属性:
yhxst69z2#
Thymeleaf 3.0提供了默认属性处理器,可以用于任何类型的自定义属性,例如,
th:data-el_id=""
变成data-el_id=""
,th:ng-app=""
变成ng-app=""
等等。不再需要受欢迎的数据属性方言。这个解决方案我更喜欢,如果我想用json作为值,而不是:
您可以使用(与文字替换结合使用):
**更新:**如果您不喜欢
th
名称空间,您也可以使用HTML5友好的属性和元素名称,如data-th-data-foobar=""
。uelo1irk3#
或者你可以用Thymeleaf方言https://github.com/mxab/thymeleaf-extras-data-attribute