thymeleaf如何判断为空_Thymeleaf参考⼿册(⼗三):⽂字
模板模式
⽂字语法
CSS。这将它们与标记模板模式区分开:HTML
JAVASCRIPT和CSS
XML。
HTML和 XML
在Thymeleaf的三种模板模式被认为是⽂字
⽂字:TEXT
TEXT,JAVASCRIPT
⽂本模板模式和标记模式之间的主要区别在于,在⽂本模板中,没有标签可以插⼊属性形式的逻辑,因此我们必须依靠其他机制。
内联的,我们已经在上⼀章中进⾏了详细介绍。内联语法是在⽂本模板模式下输出表达式结果的最简单⽅这些机制的第⼀个也是最基本的是内联的
法,因此,这是⽂本电⼦邮件完美有效的模板。
Dear [(${name})],
Please find attached the results of the report you requested
with name "[(${report.name})]".
Sincerely,
The Reporter.
TEXT 模板模式下执⾏。
即使没有标签,上⾯的⽰例也是⼀个完整且有效的Thymeleaf模板,可以在 TEXT
但是,为了包含⽐单纯的输出表达式更复杂的逻辑,我们需要⼀种新的⾮基于标记的语法:
[# th:each="item : ${items}"]
- [(${item})]
[/]
实际上是更冗长的精简版本:
[#th:block th:each="item : ${items}"]
-
[#th:block th:utext="${item}" /]
[/th:block]
<element ...>。元素以 [#element ...]
[#element ...] 开头,
[#element ...] ⽽不是 <element ...>
请注意,这种新语法是如何基于声明为的元素(即可处理标签)[#element ...]
[#element ... /]。
[/element] 闭合,并且可以通过 / / 将开始元素最⼩化来声明独⽴标签,该⽅式⼏乎等同于XML标签:[#element ... /]
以 [/element]
th:block,尽管我们可以在⽅⾔中对此进⾏扩展并以通常的⽅式创建新元素。另
标准⽅⾔仅包含⽤于以下元素之⼀的处理器:th:block
[# ...] ... [/]),因此上述代码块实际上等效于:[#th:block ...] ... [/th:block])可以缩写为空字符串([# ...] ... [/]
th:block 元素([#th:block ...] ... [/th:block]
外,th:block
[# th:each="item : ${items}"]
- [# th:utext="${item}" /]
[/]
[# th:utext="${item}" /] 等效于内联的未转义表达式,我们可以使⽤它来减少代码量。因此,我们结束了上⾯看到的代码的第⼀给定 [# th:utext="${item}" /]
个⽚段:
[# th:each="item : ${items}"]
- [(${item})]
[/]
请注意,⽂本语法要求元素对称(没有未关闭的标签)和带引号的属性 – XML样式⽐HTML样式更多。
我们来看⼀个更完整的TEXT模板⽰例,即纯⽂本电⼦邮件模板:
Dear [(${customer.name})],
This is the list of our products:
[# th:each="prod : ${products}"]
- [(${prod.name})]. Price: [(${prod.price})] EUR/kg
[/]
Thanks,
The Thymeleaf Shop
执⾏后,其结果可能类似于:
Dear Mary Ann Blueberry,
This is the list of our products:
- Apricots. Price: 1.12 EUR/kg
- Bananas. Price: 1.78 EUR/kg
- Apples. Price: 0.85 EUR/kg
- Watermelon. Price: 1.91 EUR/kg
Thanks,
The Thymeleaf Shop
JAVASCRIPT 模板模式下的另⼀个⽰例(greeter.js
greeter.js⽂件)将作为⽂本模板进⾏处理,然后从HTML页⾯调⽤该结果。请注意,这不是JAVASCRIPT
.js 单独作为模板处理的⽂件:
<script> 块,⽽是 .js
HTML模板中的 <script>
var greeter = function() {
var username = [[${session.user.name}]];
[# th:each="salut : ${salutations}"]
alert([[${salut}]] + " " + username);
[/]
};
执⾏后,其结果可能类似于:
var greeter = function() {
var username = "Bertrand "Crunchy" Pear";
alert("Hello" + " " + username);
alert("Olu00E1" + " " + username);
alert("Hola" + " " + username);
};
转义元素属性
为了避免与模板的其他部分可能会以其他⽅式处理的交互(例如,HTML模板内的⽂本模式),Thymeleaf 3.0允许转义其⽂本语法中元素的属性。所以:
TEXT 模板模式下的属性将采⽤HTML转义。
TEXT
JAVASCRIPT 模板模式下的属性将是JavaScript⾮转义的。
JAVASCRIPT
CSS 模板模式下的属性将采⽤CSS换码。
CSS
>):
因此,这在⽂本模式模板中是完全可以的(请注意 >
[# th:if="${120<user.age}"]
Congratulations!
[/]
当然,<
th:inline="text" 代码块来处理HTML模板,并且希望< 在实际的⽂本模板中这没有任何意义,但是如果我们⽤包含上⾯代码的th:inline="text"
<user.age 作为起始标记的名称。
确保我们的浏览器在静态打开⽂件作为原型时,不使⽤ <user.age
可扩展性
这种语法的优点之⼀是它与标记语法⼀样可扩展。开发⼈员仍然可以使⽤⾃定义元素和属性来定义⾃⼰的⽅⾔,为它们应⽤前缀(可选),然后在⽂本模板模式下使⽤它们:
[#myorg:dosomething myorg:importantattr="211"]some text[/myorg:dosomething]
纯⽂本原型注释块:添加代码
TEXT),允许包括⼀个特殊的注释语法之间的代码 /*[+...+]*/
CSS 模板模式(不适⽤于 TEXT
/*[+...+]*/,这样Thymeleaf会处在JAVASCRIPT
JAVASCRIPT 和 CSS
理模板时⾃动取消注释这样的代码:
var x = 23;
/*[+
var msg  = "This is a working application";
+]*/
var f = function() {
...
将解析为:
var x = 23;
var msg  = "This is a working application";
var f = function() {
...
也可以在这些注释中包含表达式,它们将被评估:
var x = 23;
/*[+
var msg  = "Hello, " + [[${session.user.name}]];
+]*/
var f = function() {
...
⽂本解析器级注释块:删除代码
在类似于仅原型的注释块的⽅式,所有三个⽂本模板模式(TEXT
JAVASCRIPT 和 CSS
CSS)使其能够指⽰Thymeleaf特殊之间移除代
TEXT,JAVASCRIPT
/* -]*/ 标志,就像这样:
码/*[- */
/
*[- */ 和 /* -]*/
var x = 23;
/*[- */
var msg  = "This is shown only when executed statically!";
/* -]*/
var f = function() {
...
TEXT 模式下:
或在 TEXT
...
/*[- Note the user is obtained from the session, which must exist -]*/
Welcome [(${session.user.name})]!
...
⾃然的JavaScript和CSS模板
如之前所述,JavaScript和CSS内联提供了将内联表达式包含在JavaScript / CSS注释中的可能性,例如:
...
var username = /*[[${session.user.name}]]*/ "Sebastian Lychee";
...
解析后结果为:
...
var username = "John Apricot";
...
实际上,可以将这种将内联表达式包含在注释中的相同技巧可⽤于整个⽂本模式语法:
/*[# th:if="${user.admin}"]*/
thymealert('Welcome admin');
/*[/]*/
如果模板是静态打开的(因为它是100%有效的JavaScript),并且如果⽤户是管理员运⾏模板,则将在上⾯的代码中显⽰该警报。它等效于:
[# th:if="${user.admin}"]
alert('Welcome admin');
[/]
实际上是模板解析期间初始版本转换成的代码。
但是请注意,注释⾏中的换⾏元素不会像内联表达式那样,清除其所在的⾏(直到⼀直在右边到a ;
a ;为⽌)。这种⾏为只适⽤于内联输出表达式。
复杂的JavaScript脚本和CSS样式表,这些模板既可以作为原型也可以作为⼯作模板以⾃然模板的形式开发复杂的JavaScript脚本和CSS样式表,这些模板
因此Thymeleaf 3.0允许以⾃然模板的形式
使⽤。
我是银河架构师,⼗年饮冰,难凉热⾎,愿历尽千帆,归来仍是少年!
如果⽂章对您有帮助,请举起您的⼩⼿,轻轻【三连】,这将是笔者持续创作的动⼒源泉。当然,如果⽂章有错误,或者您有任何的意见或建议,请留⾔。感谢您的阅读!
⽂章不定时更新,可搜索「银河架构师」,精彩内容,先睹为快!

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。