Thymelifの基本構文

2つの標準的な書き込み

			1. <span th:text=""> 这种写法需要引入 thymelif 的命名空间。"**http://www.thymeleaf.org**"
			2. <span data-th-text="...">html5的标准写法，自定义属性。这种不需要命名空间

標準式

変数式

構文：$ {…}

	<span th:text="${book.author.name}">

メッセージ表現

メッセージ式は、テキストの外部化、国際化、またはi18n
構文とも呼ばれます。＃{…}

<table>
	<th th:text="#{header.address.city}"></th>
</table>

式を選択

変数式との違い：コンテキスト変数マップ全体ではなく、現在選択されているオブジェクトで実行されます。
文法：*{…}

	<div th:object="${book}">
		<span th:text="*{title}"></span>
	</div>

リンク式

構文：@ {…}
リンク式は相対的である可能性があります。この場合、アプリケーションコンテキストはURLのプレフィックスにはなりません。

<a th:href="@{../documents/report}"></a>

サーバーの相対パス

<a th:href="@{~/contents/main}"></a>

Hexie相対（絶対URLと同じですが、ブラウザーは表示されたページで使用されているものと同じHTTPまたはHTTPSプロトコルを使用します）

<a th:href="@{//static.mycompany.com/res/initial}"></a>

もちろん、LINK式は絶対にすることができます

<a th:href="@{http://www.mycompany.com/main}"></a>

区分的表現

構文：th：insertまたはth：replace

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<body>
		<div th:fragment="copy">
、			&copy;2017 <a href="https://waylau.com">waylau.com</a>
		<div>
	</body>
</html>

フラグメントを引用するには、挿入または置換を使用します

<!--引入 th:fragment="copy"中的内容-->
<html xmlns:th="http://www.thymeleaf.org">
	<body>
		<div th:insert="~{footer :: copy}"></div>
	</body>
</html>

テキスト

<html>
	<body>
		<p>
		Now you are looking at a <span th:text="'web application'">文本需要用'单引号'引起来</span>
		</p>
	</body>
</html>

デジタル

<html>
	<body>
		<p>
		 <span th:text="2020">数字直接输入</span>
		  <span th:text="2010+10">也可以直接在里面进行数学计算</span>
		</p>
	</body>
</html>

比較と同等性

比較：>、<、> =、<=（gt、lt、ge、le）
同等：==、！=（eq、ne）

<html>
<ul class="pageination" data-th-if="${page.totalPages le 7}">
  </ul>
</html>

条件付き演算子

<tr th:class="${row.even}？’even':'add'">
</tr>

何もしない

	<span th:text="${user.name}?:_">user不存在，展示此文本</span>

属性値を設定する

1.任意の属性値th：attrを設定します

<!--定义了一个名字为action的属性值-->
<form action="subscribe.html" th:attr="action=@{/subscribe}">
	<fieldset>
		<input type="text" name="email"/>
		<input type="submit" value="Subscribe!" th:attr="value=#{subscribe.submit}"/>
	</fieldset>
</form>

表示方法

<form action="/gtvg/subscribe">
	<fieldset>
		<input type="text" name="email"/>
		<input type="submit" value="¡Suscribe!"/>
	</fieldset>
</form>

2.指定された属性に値を設定します

<form action="subscribe.html" th:attr="action=@{/subscibe}">
	<fieldset>
		<input type="text" name="email"/>
		<input type="submit" value="Subscribe!" th:attr="value=#{subscribe.submit}"/>
	</fieldset>
</form>

表示方法

	<form action="subscribe.html" th:action="@{/subscibe}">
	<input type="submit" value="Subscribe!" th:value="#{subscibe.submit}"/>

イテレータ

基本的なイテレータth：each

<li th:each="book:${books}" th:text="${book.title}"></li>

条件文

th：ifが確立されている場合は、
th：unlessを使用します。

<a href="comments.html"
	th:href="@{/product/comments{prodId=${prod.id})}“
	th:if="${not #lists.isEmpty(prod.comments)}">view</a>
<a href="comments.html“ th:href="@{/comments(prodId=${prod.id})}"
th:unless="${#lists.isEmpty(prod.comments)}">View
</a>

構文の切り替え

<div th:switch="${user.role}">
	<p th:case="'admin'">User is an administrator</p>
	<p th:case="#{roles.manager}">User is a manager</p>
	<p th:case="*">User is some other thing</p>
</div>

テンプレートのレイアウト

テンプレートレイアウトで使用される3つの属性、
th：insert、th：replace、およびth：includeは、
指定されたフラグメントを本体タグとして挿入するだけのth：insertとは異なります。
th：replace：メインタグを指定された実際のフラグメントに置き換えます。
th：include：挿入に似ていますが、フラグメントを挿入しません。このフラグメントのコンテンツを挿入するだけです。

属性の優先度

注文	特徴	属性
1	フラグメントの包含	th：include; th：replace
2	フラグメントの反復	th：each
3	条件付き評価	th：if； th：unless； th：switch； th：case
4	ローカル変数の定義	th：オブジェクト； th：with
5	一般的な属性の変更	th：attr； th：attrprepend； th：attrappend
6	特定の属性の変更	th：value、th：href、th：srcなど。
7	テキスト（タグ本体の変更）	th：テキスト； th：utext
8	フラグメント仕様	th：フラグメント
9	フラグメントの除去	th：削除

注釈

<！– / *と* / –>の間のコンテンツを削除すると、コンパイラはコンパイルされません。

<!--/*-->
<div th:switch="${user.role}">
	<p th:case="'admin'">User is an administrator</p>
	<p th:case="#{roles.manager}">User is a manager</p>
	<p th:case="*">User is some other thing</p>
</div>
<!--*/-->

静的な場合は注釈が付けられ、解析される場合は表示されます

<!--/*/
<div th:switch="${user.role}">
	<p th:case="'admin'">User is an administrator</p>
	<p th:case="#{roles.manager}">User is a manager</p>
	<p th:case="*">User is some other thing</p>
</div>
/*/-->

列をなして

[[…]]または[（）]はそれぞれth：textおよびth：utextに対応します

<!--这种特殊符号是不会被转译的-->
	<p>The message is "[($(msg)]"</p>

<p>The message is "The is <b>great!</b>"</p>

<!--[[...]]这种可以强制转换特殊字符-->
<p>The message is "[[${msg}]]</p>

出力コンテンツに[[...]]または[（...）]テキストコンテンツがある場合。インライン化を無効にする

<p th:inline="none">a double array looks in[[1,2,3,4,5,6],[1,2,3]]</p>

最初にcssを使用する場合は、th：inline = "css"を入力し、最初にjavaScripを使用する場合は、javascripと入力します。