1. 概述
Thymeleaf 是一個流行的服務器端 Java 模板引擎，它允許我們創建動態網頁。它提供了多個屬性，用於將模型中的數據綁定到視圖。
在本簡短教程中，我們將探討 th:text 和 th:value 屬性之間的關鍵差異。
2. 屬性
Thymeleaf 中的 屬性 用於設置元素的文本內容。
此外，它 替換了標準的 HTML 屬性。因此，我們可以將其放在任何支持文本內容的 HTML 元素中，例如標題、段落、標籤等。
此外，我們還可以使用該屬性來顯示動態文本內容，例如網頁上的標題。
假設我們想在 HTML 頁面上顯示控制器提供的 屬性。
首先，讓我們創建一個控制器類和方法，其中我們將指定模型屬性：
@GetMapping
public String show(Model model) {
model.addAttribute("title", "Baeldung");
return "attributes/index";
}接下來，我們將值顯示在標題元素中：
<h1 th:text="${title}"/>在這裏，Thymeleaf 會評估表達式 “${title}” 並將值插入到標題元素中。
我們將獲得生成的 HTML：
<h1>Baeldung</h1>此外，與標準 HTML 的 text 屬性不同，th:text 屬性支持表達式。除了變量之外，這些表達式可能還包括運算符和函數。
例如，讓我們在 title 屬性未提供的情況下指定默認值：
<h1 th:text="${title} ?: 'Default title'"/>3. 屬性 <em th:value</em>
另一方面，`` 屬性用於設置通常需要用户輸入值的元素。例如，輸入字段、複選框、單選按鈕和下拉菜單等元素都屬於此類。
我們可以使用此屬性代替標準 HTML 的 屬性，在任何具有 屬性的元素中使用。因此，向不支持此屬性的元素添加它——例如，段落——將沒有任何效果。
首先，讓我們創建一個包含一個用於電子郵件的簡單表單：
<form th:action="@{/attributes}" method="post">
<input type="email" th:value="${email}">
<input type="submit" value="Submit"/>
</form>接下來，我們修改控制器的實現方法，並添加 email 屬性：
@GetMapping
public String show(Model model) {
model.addAttribute("title", "Baeldung");
model.addAttribute("email", "[email protected]");
return "attributes/index";
}最後，Thymeleaf 會顯示輸入元素內的值：
<input type="email" value="[email protected]">由於我們使用 th:value 在輸入字段中，因此更有可能希望在表單提交時將值返回到控制器。 :
<input th:name="email" type="email" th:value="${email}">現在，我們可以為我們的控制器添加一個 POST 方法，以讀取用户的輸入：
@PostMapping
public String submit(String email) {
logger.info("Email: {}", email);
return "attributes/index";
}該屬性還支持表達式。
<input type="email" th:value:"${email} ?: '[email protected]'"/>4. 結論
在本文中，我們探討了 th:text 和 th:value 這兩個 Thymeleaf 屬性之間的差異。我們使用 th:text 屬性來指定元素的文本內容，使用 th:value 屬性來設置元素的數值。
