thymeleaf-js获取当前用户以及遍历ajax的json数组 - 好文

项目用到thymeleaf3.0，有个需求是异步获取菜单并展示。发现thymeleaf对异步的json支持不太好（其实解析异步的json不符合thymeleaf的初衷）。这里算是踩了一个坑，在此记录下来。

先上完成后的代码：
<script type="text/javascript"> var data={
userId:[[${#authentication.principal.id}]] } var url = '[[@{/getMenu}]]';
function getMenu(){ $.get(url,data,function(data){ var html = ''; for(var i =
0;i<data.length;i++) { html+='<li><a href="'; html+=[[@{data[i].path}]];
html+='">' html+=data[i].name; html+='</a></li>'; } $("#menu").html(html); });
} getMenu(); </script>
注意事项：

* 参数中的userId是从spring-security中获取，这个principal是经过我扩展的，所以有ID属性。
*
异步获取json后，使用上述代码中的格式才行，并且我获取到的链接（以home举例,我希望生成的路径是：localhost:8080/project/home），前面若以/开头，最终生成的是从根路径开始的路径（如：localhost:8080/home），项目路径丢失（已测试）；若不是以/开头，则最终生成的路径是从当前目录开始（未测试）（如：localhost:8080/project/test/home）。所以使用过程中这个要注意一下。
* 以下两种情况不管用，thymeleaf会解析不到，最终data是null或者根本不存在的东西，js会报错：<script
type="text/javascript" th:inline="javascript"> $.get(url,data,function(data){
var html = ''; for(var i = 0;i<data.length;i++) { html=[[@{data[i].path}]];
html=[(@{data[i].path})]; } }); <script>
关键还在于script标签中加的th:inline属性。要去掉。

最后参考资料的地址：

Thymeleaf print JSON string as JSON object into a javascript variable
<https://stackoverflow.com/questions/29733594/thymeleaf-print-json-string-as-json-object-into-a-javascript-variable>
- stackoverflow

[MAJOR FEAT] New syntax for textual template modes
<https://github.com/thymeleaf/thymeleaf/issues/395> -github

热门工具换一换