1. Обзор
В этом кратком руководстве мы покажем , как привязать объект List в Thymeleaf .
Чтобы узнать, как интегрировать Thymeleaf с Spring, вы можете ознакомиться с нашей основной статьей Spring здесь, где вы также можете узнать, как отображать поля, принимать ввод, отображать ошибки проверки или преобразовывать данные для отображения.
2. Списки в примере Thymeleaf
Мы начнем с того, что покажем , как отображать элементы Списка на странице Thymeleaf и как привязать список объектов в качестве входных данных пользователя в форме Thymeleaf .
Для этой цели мы будем использовать простую модель, показанную в следующем коде:
public class Book {
private long id;
private String title;
private String author;
// getters and setters
}Помимо отображения существующих книг в нашем примере, мы собираемся предоставить пользователю возможность добавлять несколько книг в коллекцию, а также редактировать все существующие книги одновременно.
3. Отображение элементов Списка
Давайте рассмотрим следующий метод Controller , который возвращает страницу all Books :
@GetMapping("/all")
public String showAll(Model model) {
model.addAttribute("books", bookService.findAll());
return "books/allBooks";
}Здесь мы добавили List объектов Book в качестве атрибута модели, отправленного в представление, где мы будем отображать его с помощью таблицы HTML:
| Title | Author |
|---|---|
| No Books Available | |
| Title | Author |
Здесь/| мы используем свойство th:each для перебора списка и отображения свойств каждого объекта в нем.
4. Привязка Списка С Помощью выражения выбора
Чтобы отправить список объектов из представления в контроллер через форму отправки, мы не можем использовать List сам объект.
Вместо этого мы должны добавить объект-оболочку, который будет содержать представленный список:
public class BooksCreationDto {
private List books;
// default and parameterized constructor
public void addBook(Book book) {
this.books.add(book);
}
// getter and setter
} Теперь давайте позволим пользователю добавить три книги в одну отправку формы.
Сначала мы подготовим страницу формы, передав наш объект команды в качестве атрибута Model :
@GetMapping("/create")
public String showCreateForm(Model model) {
BooksCreationDto booksForm = new BooksCreationDto();
for (int i = 1; i <= 3; i++) {
booksForm.addBook(new Book());
}
model.addAttribute("form", booksForm);
return "books/createBooksForm";
}Как мы видим, мы передали список из 3 пустых объектов Book в представление через класс-оболочку.
Затем нам нужно добавить форму на страницу Thymeleaf:
И вот как будет выглядеть страница выше: