Question

开始在Spring Boot中使用ThymeLeaf，我遇到了将简单片段加载到JS变量中的问题。尝试将行追加到数据表中，其中一个单元格应包含复杂的HTML部分。像这样：

...
var cell_content = <Load thymeleaf fragment content with parameters>;
...

现在假设我有一个名为“x :: docs-popup”的ThymeLeaf片段，其中包含用于文档操作的Bootstrap Popup，如何加载此弹出窗口的内容，包括传递的参数到javascript变量cell_content中，所以我将它附加到生成的行。

换句话说，如果我使用的是php，我会执行以下操作：

 var cell_content = '<?php echo fragment_loader($document_object); ?>'

Answer 1

有趣的问题......在thymleaf 3中，这样的事情对我有用：

<script th:inline="javascript">
    cell_content = '[# th:insert="~{x :: docs-popup}"/]';
</script>

但是，它并不会自动转义包含中的任何内容。所以流浪的单引号会破坏javascript。

我可能会在页面上正常包含它（但是将它设为display: hidden），并且只能通过id引用它。

Answer 2

一种直接的方法是向控制器发出调用，该控制器返回片段的html。请参阅文档in the section about Fragment inclusion from Spring @Controller

// in your view
<script th:inline="javascript">
/*<![CDATA[*/ 
   var url = /*[[@{/docs/}]]*/;
   $.get(url + param, function(fragment) {
          $rowDocPopup = $('...'); // get selector for the cell you need
          $rowDocPopup.replaceWith(fragment);
    });
/*]]>*/
</script>

然后在控制器中：

@RequestMapping("/docs/{id}")
public String reloadDocsPopup(@PathVariable Long id, Model model){
    // do stuff and put parameter data in model 
    return "templates/x :: docs-popup";
}

如何将thymeleaf片段加载到js变量中

2 个答案: