Вставка фрагмента JavaScript с использованием Thymeleaf включает двойные кавычки

Question

Я пытаюсь динамически создать Javascript в шаблоне Thymeleaf, чтобы использовать пакет временной шкалы Google Chart (обратите внимание - этот пакет недоступен в весенней версии библиотеки Google).

У меня есть фрагмент Thymeleaf ganttchartvalue.html со следующим кодом, который затем включается в фактическую страницу:

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" th:inline="javascript">
/*<![CDATA[*/

  google.charts.load('current', {'packages':['timeline']});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {
    var container = document.getElementById('timeline');
    var chart = new google.visualization.Timeline(container);
    var dataTable = new google.visualization.DataTable();

    dataTable.addColumn({ type: 'string', id: 'Card' });
    dataTable.addColumn({ type: 'date', id: 'Start' });
    dataTable.addColumn({ type: 'date', id: 'End' });
    dataTable.addRows([ /*[[${Parms}]]*/ ]);

    chart.draw(dataTable);
  }

/*]]>*/
</script>

В моем классе GanttController у меня есть следующий код:

String Parms = "['MegaCorp App 1', новая дата (2018, 7, 2), новая дата (2019, 4, 9)]»; model.put ("Parms", Parms);

(модель относится к карте).

Это близко к работе, но сгенерированный вывод (конечный источник страницы):

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
/*<![CDATA[*/

  google.charts.load('current', {'packages':['timeline']});
  google.charts.setOnLoadCallback(drawChart);
  function drawChart() {
    var container = document.getElementById('timeline');
    var chart = new google.visualization.Timeline(container);
    var dataTable = new google.visualization.DataTable();

    dataTable.addColumn({ type: 'string', id: 'Card' });
    dataTable.addColumn({ type: 'date', id: 'Start' });
    dataTable.addColumn({ type: 'date', id: 'End' });
    dataTable.addRows([ "[ 'MegaCorp App 1', new Date(2018, 7, 2), new Date(2019, 4, 9) ]"]);

    chart.draw(dataTable);
  }

/*]]>*/
</script>

Вопрос:

Как убрать дополнительные двойные кавычки (") до и после вставленного текста в вызове метода dataTable.addRows, чтобы этот код работал правильно?

Спасибо

Answer 1

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

model.put("parms", new Object[] {new String[] {"MegaCorp App 1", "2018-07-02", "2018-04-09"}});

А потом в вашем javascript:

<script type="text/javascript" th:inline="javascript">
.
.
.
var rows = /*[[${parms}]]*/ null;
rows[0][1] = new Date(rows[0][1]);
rows[0][2] = new Date(rows[0][2]);
dataTable.addRows(rows);
.
.
.
</script>