如何使用Thymeleaf展示列表数据？含实体、控制器及视图代码

Hey there! Let's get your Thymeleaf user list displaying smoothly. I'll walk you through the exact steps to finish your implementation, with clear code examples and explanations.

Step 1: Confirm Your Controller Setup #

First, let's make sure your controller is correctly passing the User list to the view. Here's a complete, working example based on your description:

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import java.util.ArrayList;
import java.util.List;

@Controller
public class UserController {

    @RequestMapping("/listRappel")
    public String getUserList(Model model) {
        // Create and populate your User list
        List<User> userList = new ArrayList<>();
        
        // Use setters to populate user data (or use a parameterized constructor)
        User user1 = new User();
        user1.setName("Alice");
        User user2 = new User();
        user2.setName("Bob");
        
        userList.add(user1);
        userList.add(user2);

        // Add the list to the Model with a key ("users" will be used in Thymeleaf)
        model.addAttribute("users", userList);
        
        // Return the name of your Thymeleaf view template
        return "UserView";
    }
}

Note: Double-check that your User class has proper getter methods (getId() and getName()), as Thymeleaf relies on these to access object properties.

Step 2: Complete the Thymeleaf Table #

Now let's finish your HTML table to render the user data. Make sure to include the Thymeleaf namespace and use the th:each directive to loop through your list:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>User List</title>
    <!-- Optional: Add basic styling for readability -->
    <style>
        table { border-collapse: collapse; width: 60%; margin: 20px 0; }
        th, td { border: 1px solid #ccc; padding: 10px; text-align: left; }
        th { background-color: #f5f5f5; }
    </style>
</head>
<body>
    <h2>Registered Users</h2>
    <table>
        <!-- Table header -->
        <tr>
            <th>User ID</th>
            <th>User Name</th>
        </tr>
        <!-- Loop through the users list -->
        <tr th:each="user : ${users}">
            <!-- Populate table cells with User properties -->
            <td th:text="${user.id}"></td>
            <td th:text="${user.name}"></td>
        </tr>
    </table>
</body>
</html>

Key Thymeleaf Features Explained: #

• xmlns:th="http://www.thymeleaf.org": Declares the Thymeleaf namespace so the template engine recognizes its attributes.
• th:each="user : ${users}": Iterates over the users list stored in the Model, assigning each User object to the user variable for each loop iteration.
• th:text="${user.id}" / th:text="${user.name}": Inserts the value of the User's id and name properties into the table cells, replacing static content with dynamic data.

Step 3: Final Checks #

• Ensure your Thymeleaf template (UserView.html) is saved in the correct directory: src/main/resources/templates/ (this is Spring Boot's default location for Thymeleaf views).
• Verify that the key name in model.addAttribute("users", userList) matches the variable used in th:each="user : ${users}" (they must be identical).
• Confirm your User class has the @Id and @GeneratedValue annotations correctly set up for the id field—this ensures the ID value is populated when users are created.

Once all these steps are done, run your application and navigate to http://localhost:8080/listRappel (adjust the port if needed) to see your user list displayed in a table!

内容的提问来源于stack exchange，提问作者mohamed andr