Thymeleaf教程 （十二） 标签内，js中使用表达式

在文本中使用表达式

当然，我们同样可以在标签内赋值。

Hello, [[${session.user.name}]]!

• 1

效果和下面一样：

<p>Hello, <span th:text="${session.user.name}">Sebastianspan>!p>

• 1

[[…]]之间的内容可以被赋值。为了使其生效，必须在此标签或者任何父标签上有th:inline属性。此属性有三种值（text , javascript and none）。text属性的用法：

"text">Hello, [[${session.user.name}]]!

• 1

也可以在父标签上有此属性：

"text">
...
    
Hello, [[${session.user.name}]]!
...

• 1
• 2
• 3
• 4
• 5

在javaScript中使用表达式

给js变量赋值

表达式同样可以在javascript中使用。先用属性声明一下：javascript ( th:inline=”javascript” )，然后我们开始在js中声明变量：

• 1
• 2
• 3
• 4
• 5
• 6
• 7

/*[[…]]*/表达式的理解如下：

• /*…*/中的内容在用浏览器打开静态 网页时，会被忽略.
• ‘Sebastian’会在浏览器中显示。静态时。

• Thymeleaf解析时，会解析/*[[…]]*/的内容，并把获得的值替换掉/*[[…]]*/后面的内容。

  所以执行的结果如下：

• 1
• 2
• 3
• 4
• 5
• 6
• 7

你也可以不用注释：

• 1
• 2
• 3
• 4
• 5
• 6
• 7

这会让它在静态显示时出现错误。 
注意：引擎求值后注入是智能的，它可以智能赋值一下类型的数据。

• Strings
• Numbers
• Booleans
• Arrays
• Collections
• Maps
• Beans (objects with getter and setter methods) 
  举个栗子：

script th:inline="javascript">
/*...
var user = /*[[${session.user}]]*/ null;
...
/*]]>*/

• 1
• 2
• 3
• 4
• 5
• 6
• 7

${session.user}会获取一个user对象。写入后如下：

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8

引擎同样允许增加和删除代码块，增加代码块：

var x = 23;
/*[+
var msg = 'This is a working application';
+]*/
var f = function() {
...

• 1
• 2
• 3
• 4
• 5
• 6

解析如下：

var x = 23;
var msg = 'This is a working application';
var f = function() {
...

• 1
• 2
• 3
• 4

删除代码块：

var x = 23;
/*[- */
var msg = 'This is a non-working template';
/* -]*/
var f = function(){
...

• 1
• 2
• 3
• 4
• 5
• 6

解析如下：

var x = 23;
var f = function(){
...

• 1
• 2
• 3