Thymeleaf将JSON字符串作为JSON对象打印到javascript变量中

Question

In Specific

I need a way to print JSON representation of a string value into the html page via thymeleaf.

In detail

I'm having a model attribute which contains a string which is actually a string representation of the JSON

My thymeleaf code

<script th:inline="javascript">
  var value = [[${data.scriptValue}]];
</script>

print the variable as below

var value = '[[\"asd\",\"3\"],[\"asd\",\"1\"],[\"asdasd\",\"1\"]]';

But I want something like this as a javascript/JSON array

var value = [["asd","3"],["asd","1"],["asdasd","1"]];

How to do this in thymeleaf?

---

Note: I know I can do this from JSON.Parse but i need a way to do this from thymeleaf :)

Answer 1

Update - 2015/12/24

This feature is available in Thymeleaf 3

Refer The Thymeleaf textual syntax in https://github.com/thymeleaf/thymeleaf/issues/395

// Unescaped (actual answer)
var value = [(${data.scriptValue})];
//or
var value = [# th:utext="${data.scriptValue}"/];

// Escaped
var value = [[${data.scriptValue}]];
//or
var value = [# th:text="${data.scriptValue}"/];

---

It's not possible at Thymeleaf 2. As Patric LC mentioned, there are two issues reported for this.

1. unescaped inline for scripts/css #12

2. Use Jackson for Javascript inlining of JSON #81

Answer 2

@Faraj, new version of Thymeleaf provides this functionality. They implement features for the issues that you mentioned. You can look here: http://www.thymeleaf.org/doc/articles/thymeleaf3migration.html

The main features:

• Three textual template modes: TEXT, JAVASCRIPT and CSS.
• New syntax for elements in textual template modes: [# ...] ... [/] .
• Inlined output expressions allowed, both escaped ([[...]]) and unescaped ([(...)]) .
• Intelligent escaping of JavaScript (as literals) and CSS (as identifiers).
• Parser-level (/*[- ... -]*/) and prototype-only (/*[+ ... +]*/) comment blocks.
• Natural templates applied to JAVASCRIPT scripts and CSS style sheets by means of wrapping elements and/or output expressions inside comments (/*[# ...]*/) .