JavaScript 中的 Thymeleaf forEach 循环

Question

我正在将项目从 JSP 迁移到 Thymeleaf。

在一些 JSP 中，我做了像这样的奇特的东西：

<script type="text/javascript">
    //<c:forEach items="${pages}" var="page">

    ...
    var l = new google.maps.LatLng("${page.lat}", "${page.long}");
    ...

    //</c:forEach>
</script>

我怎样才能对 Thymeleaf 做同样的事情？

Answer 1

您可以将属性写出到

<span id="myvar" th:text="${attributeName}"></span>

然后您可以使用 JS 访问它：

document.getElementById("myvar") 或 jquery $('#myvar').text()

Thymeleaf 代码在服务器端是运行，在客户端是 JS 代码。我想知道 jsp 是如何不费吹灰之力地应付这名员工的。

Answer 2

这是 Thymeleaf 3.0.2 的工作解决方案：

<script th:inline="javascript">
/*<![CDATA[*/

    /*[# th:each="page : ${pages}"]*/
        ...
        var l = new google.maps.LatLng(/*[[${page.lat}]]*/, /*[[${page.long}]]*/);
        ...
    /*[/]*/

/*]]>*/
</script>

这里解释了为什么以及如何工作：[主要成就] 文本模板模式的新语法 #395

JavaScript 中的 Thymeleaf forEach 循环

Thymeleaf forEach loop in JavaScript

jsp

jstl

thymeleaf