javascript - 将列表传递给 js、thymeleaf、springboot

Question

我想将一个列表从控制器传递到一个 javascript 文件并在 js 文件中迭代它。但是我在 js 中只得到了“未定义”。

我使用 Thymeleaf 模板，我的 js 文件与我的 html 分开。

//控制器

List<Bean> list = new ArrayList<Bean>();
model.addAttribute("list", list);

//html

<input id="list" type="hidden"  th:value="${list}"/>

//javascript

var list=$('#list').val();
console.log("list: "+ list); 
//[Bean(month=201805, date=2018-05-02),Bean(month=201804, date=2018-05-03)], which is correct


for(var i in list) {
  console.log("date: "+ list[i].date);  //  I  got undefined
  console.log("month: "+ list[i].month);  // I  got undefined,too
}

我希望得到月份和日期的值，有人知道吗？

Answer 1

与其将列表放入 html 元素中，不如将其直接放入 Javascript 中。像这样：

<script th:inline="javascript">
    var list = /*[[${list}]]*/ [];
</script>
<script src="/your_other_javascript_file.js"></script>

你的循环不起作用的原因是它$('#list').val();不是一个数组，它是一个字符串。循环遍历字符串不会达到您的预期。