知識庫 / Spring / Spring MVC RSS 訂閱

1. 概述

Thymeleaf 是一個現代 Java 模板引擎，用於構建 Web 環境。它非常適合現代 HTML Web 開發。此外，Thymeleaf 與 Spring Boot 完美配合。

在本教程中，我們將學習如何在 Thymeleaf 中條件添加 已選中 屬性到輸入框。

2. 使用 th:checked 屬性

Thymeleaf 標準方言允許我們為 HTML 文檔中的任何元素添加固定值布爾屬性。其中之一是 th:checked 屬性，它等同於 HTML 中的 checked 屬性。

th:checked 屬性用於 HTML 文檔中的所有類型為 checkbox 的輸入元素。它也接受 Boolean 類型的任何表達式，這些表達式會被評估為 true 或 false。

例如，要決定一個複選框是否被選中，Thymeleaf 引擎會評估 th:checked 屬性中指定的條件。如果條件評估結果為 true，則複選框將被選中。如果條件評估結果為 false，則複選框將未選中。

3. 示例

讓我們通過一個實際示例來了解 Thymeleaf 的 <em th:checked</em> 屬性的工作原理。首先，我們將定義一個 Spring 控制器：

@Controller
public class AttributeController {

    @GetMapping("/checked")
    public String displayCheckboxForm(Model model) {
        Engine engine = new Engine(true);
        model.addAttribute("engine", engine);
        model.addAttribute("flag", true);
        return "attribute/index";
    }

    private static class Engine {
        private Boolean active;

        public Engine(Boolean active) {
            this.active = active;
        }

        public Boolean getActive() {
            return active;
        }
    }
}

我們的控制器允許初始化兩個變量，一個類型為 Boolean，我們將其命名為 “flag”，另一個對象 Engine，其中包含一個類型為 Boolean 的屬性，我們將其命名為 “active”。 讓我們在模板中使用這這兩個變量，以查看我們如何使用 Thymeleaf 指示條件激活或停用複選框，使用 th:checked：

<form method="post">
    <label>
        <input type="checkbox" th:checked="${flag}"/> Flag activated
    </label>
    <label>
        <input type="checkbox" th:checked="${engine.getActive()}"/> Customer activated
    </label>
    <label>
        <input type="checkbox" th:checked="${flag ? false: true}"/> Flag deactivated
    </label>
</form>

在我們的模板中，我們使用 flag變量和 engine.active屬性來設置複選框。由於我們初始化這些變量為 true，因此第一個和第二個複選框被激活，而第三個複選框被停用，因為我們的條件表達式評估結果為 false。

4. 結論

在本快速教程中，我們瞭解到在 Thymeleaf 中使用 checked 屬性的用法。我們還通過一個實際示例學習瞭如何在 Thymeleaf 中條件地添加 checked 屬性到輸入框中。