在javascript中使用Spring变量

Question

我试图在javascript中使用Spring变量：

Map<String, List<String>> states;

我在这里找到了一些信息

所以我试着：

<script th:inline="javascript">
  /*<![CDATA[*/ 
    var xxx = ${states};
    console.log(xxx);
  /*]]>*/
</script>

在浏览器的“源”选项卡中，我有如下内容：

var xxx = {STATE1=[a, b, c, d]};
console.log(xxx);

错误是：未捕获语法错误：速记属性初始值设定项无效。

我还尝试了：var xxx = /*[[${}]]*/ 'foo'；如果我打印console.log（xxx），我得到了'foo'。

Answer 1

我使用您的评论解决了我的问题：

1） 缺少一个报价：

<script th:inline="javascript">
  /*<![CDATA[*/ 
    var xxx = '${states}';
    console.log(xxx);
  /*]]>*/
</script>

2） 必须分析对象，以便：

  var hashmap = $.parseJSON(xxx);

3） 在我需要序列化我的对象之前（这不是ajax调用，所以我需要手动序列化它）：

Map<String, List<String>> states...
  model.addAttribute("states", new ObjectMapper().writeValueAsString(states));

现在我可以读我的物体了：

var myList = hashmap['STATE1'];
console.log(myList ) 

将打印[a， b， c， d]，我可以循环：

for(i in myList ){
  console.log(myList[i]);
}

Answer 2

{b}由于{c}错误，此对象代码是无效的。

解释非常简单：您看到的是服务器端渲染的产物（您使用的Thymeleaf非常胖，正如我所建议的：内联标签）。因此，在服务器上，您的map对象get呈现为{STATE1=[a， b， c， d]}字符串。在您的客户端（浏览器）上，您将获得带有此字符串的页面，而不是其他内容。已经没有任何Java对象。只是字符串。这个字符串在Javascript中是无效的对象初始化。

所以你不能这样使用地图。您无法使用JSON解析此内容。解析，因为它是无效的JSON（应该使用：而不是=）。

希望这能有所帮助！

注意：如果你试图用Javascript中的=替换：它的工作方式与你预期的不同：数组[a，b，c，d]将被视为一个变量数组，其名称为a，b，c和d，因此你必须在'中删除它。但我建议抛弃这个想法，重新思考你的方法。这不是应该使用的方式。