HTML 如何根据其他变量设置Thymeleaf的th:field值

在本文中，我们将介绍如何通过其他变量的值来设置Thymeleaf的th:field属性。Thymeleaf是一种Java模板引擎，它允许我们在HTML页面中嵌入动态内容。

在使用Thymeleaf时，经常会遇到需要根据其他变量的值来动态设置th:field属性的情况。下面将介绍两种主要方法来实现这一功能。

阅读更多：HTML 教程

方法一：使用th:attr设置属性值

Thymeleaf的th:attr属性允许我们动态设置HTML元素的任意属性。我们可以使用th:attr来设置th:field属性的值。下面是一个示例：

<form th:object=" ${user}" th:action="@{/save}" method="post"> <input type="text" th:attr="th:field=$ {'user.name'}" />
    <input type="text" th:attr="th:field=${'user.email'}" />
    <button type="submit">保存</button>
</form>

在上面的例子中，我们使用了th:attr来设置th:field属性的值。${'user.name'}表示取名为”user.name”的变量的值，并将其作为th:field的值。${'user.email'}同样的道理。

方法二：使用变量表达式

Thymeleaf还支持使用变量表达式来设置属性值。我们可以使用${}来引用变量，并将其嵌入到th:field属性中。下面是一个示例：

<form th:object=" ${user}" th:action="@{/save}" method="post"> <input type="text" th:field="$ {user.name}" />
    <input type="text" th:field="${user.email}" />
    <button type="submit">保存</button>
</form>

在上面的例子中，${user.name}表示取名为”user.name”的变量的值，并将其作为th:field的值。${user.email}同样的道理。

需要注意的是，使用变量表达式时，不需要额外的th:attr属性。Thymeleaf会自动将变量表达式的值赋给th:field属性。

示例说明

假设我们有一个User对象，包含name和email属性。我们要在表单中展示和修改用户信息，同时需要根据不同的条件设置th:field属性的值。

下面是一个完整的示例代码：

@Controller
public class UserController {

    @GetMapping("/edit")
    public String edit(Model model) {
        User user = new User();
        user.setName("John");
        user.setEmail("john@example.com");
        model.addAttribute("user", user);
        model.addAttribute("fieldName", "name");
        return "edit";
    }
}

在Controller中，我们创建一个User对象，并将其放入Model中。同时，还将一个名为”fieldName”的变量设置为”name”。

<!-- edit.html -->
<form th:object=" ${user}" th:action="@{/save}" method="post"> <input type="text" th:attr="th:field=$ {fieldName}" />
    <input type="text" th:field="${user.email}" />
    <button type="submit">保存</button>
</form>

在HTML文件中，我们使用th:attr来设置th:field属性的值，${fieldName}表示取名为”fieldName”的变量的值。

当我们访问/edit页面时，表单中的第一个输入框的值将根据”fieldName”的值动态变化，而第二个输入框的值将会是User对象的email属性的值。