Thymeleaf inline javascript с кавычками не работает - PullRequest
Новая
       7

Thymeleaf inline javascript с кавычками не работает

1 голос
/ 06 мая 2020

У меня есть приложение загрузки Spring, использующее Thymeleaf. Я устанавливаю переменную модели со значением String и хочу использовать ее как значение переменной в javascript.

В Java Я делаю что-то вроде: 

StringBuffer data = new StringBuffer();
data.append("[ [\"").append(name1).append("\" ], \"").append(name2).append("\"] ] ");
...
model.addAttribute("dataString", data);

Мой код в HTML выглядит так: 

<script th:inline="javascript">
  /*<![CDATA[*/
  var dataSet = [[${dataString}]];
  /*]]>*/
...
</script>

Результат в JavaScript должен быть : 

var dataSet = [ ["Name1"], ["Name2"] ];

Но то, что я получаю, находится в HTML: 

var dataSet = "[ [\"Name1\"], [\"Name2\"] ]";

Я пробовал разные вещи в HTML / JavaScript:

  • с использованием только одной скобки [$dataString] -> приводит к var dataSet = [${dataString}];;
  • , используя это: /*[$dataString]*/ -> дает var dataSet = /*[${dataString}]*/;;
  • или: /*[[$dataString]]*/ - > приводит к var dataSet = "[ [\"Name1\"], [\"Name2\"] ]";
  • , удаляя содержимое CDATA -> ничего не изменилось

Ничего не дает правильной строки в JavaScript. Как я могу получить правильную строку?

1 Ответ

2 голосов
/ 07 мая 2020

Вы не должны передавать JSON строк от вашего контроллера к вашей модели. Вместо этого вы должны передавать обычные объекты Java и позволять Thymeleaf выполнять кодирование за вас. Например, если вам нужен набор данных, который выглядит следующим образом: 

[ ["Name1"], ["Name2"] ]

Затем вы должны добавить его в свою модель следующим образом: 

// This is an array of arrays, just like [ ["Name1"], ["Name2"] ]
String[][] dataset = {{"Name1"}, {"Name2"}};
model.addAttribute("dataString", dataset);

Затем результат 

<script th:inline="javascript">
  /*<![CDATA[*/
  var dataSet = [[${dataString}]];
  /*]]>*/
</script>

Результатом будет JavaScript: 

var dataSet = [ ["Name1"], ["Name2"] ];

Как вы и хотели, без необходимости вручную создавать строку. Это, конечно, работает со всеми видами Java объектов и даже автоматически конвертирует геттеры и сеттеры в обычные JavaScript объекты.

Конечно, если вы действительно просто хотите добавить JSON строки прямо из вашей модели, вы, конечно, можете использовать неэкранированный inline. 

var dataSet = [(${dataString})];

Но это действительно противоречит тому, как этот материал должен работать.

...