使用 Thymeleaf 从 Spring 模型设置 JavaScript 变量
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25687816/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Setting up a JavaScript variable from Spring model by using Thymeleaf
提问by Matteo
I am using Thymeleaf as template engine. How I pass a variable from Spring model to JavaScript variable?
我使用 Thymeleaf 作为模板引擎。我如何将变量从 Spring 模型传递给 JavaScript 变量？
Spring-side:
弹簧侧：
@RequestMapping(value = "message", method = RequestMethod.GET)
public String messages(Model model) {
model.addAttribute("message", "hello");
return "index";
}
Client-side:
客户端：
<script>
....
var m = ${message}; // not working
alert(m);
...
</script>
回答by vdenotaris
According to the official documentation:
根据官方文档：
<script th:inline="javascript">
/*<![CDATA[*/
var message = /*[[${message}]]*/ 'default';
console.log(message);
/*]]>*/
</script>
回答by user5518390
var message =/*[[${message}]]*/ 'defaultanyvalue';
回答by redochka
Thymeleaf 3 now:
现在百里香3：
Display a constant:
<script th:inline="javascript"> var MY_URL = /*[[${T(com.xyz.constants.Fruits).cheery}]]*/ ""; </script>Display a variable:
var message = [[${message}]];Or in a comment to have a valid JavaScript code when you open your template file in a static manner (without executing it at a server).
Thymeleaf calls this: JavaScript natural templates
var message = /*[[${message}]]*/ "";Thymeleaf will ignore everything we have written after the comment and before the semicolon.
显示一个常量：
<script th:inline="javascript"> var MY_URL = /*[[${T(com.xyz.constants.Fruits).cheery}]]*/ ""; </script>显示一个变量：
var message = [[${message}]];或者在以静态方式打开模板文件时（不在服务器上执行它）时在注释中获得有效的 JavaScript 代码。
Thymeleaf 称之为：JavaScript 自然模板
var message = /*[[${message}]]*/ "";Thymeleaf 将忽略我们在评论之后和分号之前写的所有内容。
More info: http://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#javascript-inlining
更多信息：http: //www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#javascript-inlining
回答by sanluck
According to the documentationthere are several ways to do the inlining.
The right way you must choose based on the situation.
根据文档，有几种方法可以进行内联。
您必须根据情况选择正确的方法。
1) Simply put the variable from server to javascript :
1) 只需将变量从服务器放到 javascript 中：
<script th:inline="javascript">
/*<![CDATA[*/
var message = [[${message}]];
alert(message);
/*]]>*/
</script>
2) Combine javascript variables with server side variables, e.g. you need to create link for requesting inside the javascript:
2) 将 javascript 变量与服务器端变量结合，例如，您需要在 javascript 内部创建用于请求的链接：
<script th:inline="javascript">
/*<![CDATA[*/
function sampleGetByJquery(v) {
/*[+
var url = [[@{/my/get/url(var1=${#httpServletRequest.getParameter('var1')})}]]
+ "&var2="+v;
+]*/
$("#myPanel").load(url, function() {});
}
/*]]>*/
</script>
The one situation I can't resolve- then I need to pass javascript variable inside the Java method calling inside the template (it's impossible I guess).
我无法解决的一种情况- 然后我需要在模板内部调用的 Java 方法中传递 javascript 变量（我猜这是不可能的）。
回答by Nitish Kanade
MAKE sure you have thymleaf on page already
确保你已经在页面上有 thymleaf
//Use this in java
@Controller
@RequestMapping("/showingTymleafTextInJavaScript")
public String thankYou(Model model){
model.addAttribute("showTextFromJavaController","dummy text");
return "showingTymleafTextInJavaScript";
}
//thymleaf page javascript page
<script>
var showtext = "[[${showTextFromJavaController}]]";
console.log(showtext);
</script>
回答by Noumenon
I've seen this kind of thing work in the wild:
我在野外看到过这种事情：
<input type="button" th:onclick="'javascript:getContactId(\'' + ${contact.id} + '\');'" />
