Thymeleaf for JavaScriptの各ループ

Question

私は、プロジェクトをJSPからThymeleafに移行しています。私はThymeleafと同じことを行うことができますどのように

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

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

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

：いくつかのJSPで

は、私はこのような派手なものをやりましたか？

Answer 1

これはThymeleaf 3.0.2で実用的なソリューションです：

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

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

/*]]>*/ 
</script> 

それが動作する理由はここに説明されている：あなたのヒントの[MAJOR FEAT] New syntax for textual template modes #395

Answer 2

あなたは

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

に属性を書き出すことができます次に、あなたのようにJSでそれにアクセスすることができます。

document.getElementById("myvar")またはjquery $('#myvar').text()

Thymeleafコードは、サーバー側とJSコードで実行されていますクライアント側。私はjspがどんなトリックもなしにこのスタッフをどのようにしているのだろうと思っています。