Введение в использование Thymeleaf весной

1. Вступление

Thymeleaf - это шаблонизатор Java для обработки и создания HTML, XML, JavaScript, CSS и текста.

В этой статье мы обсудимhow to use Thymeleaf with Spring вместе с некоторыми основными вариантами использования на уровне представления приложения Spring MVC.

Библиотека чрезвычайно расширяема, а ее естественная возможность создания шаблонов позволяет создавать прототипы шаблонов без серверной части, что делает разработку очень быстрой по сравнению с другими популярными шаблонизаторами, такими как JSP.

2. Интеграция Thymeleaf с Spring

Во-первых, давайте посмотрим конфигурации, необходимые для интеграции с Spring. Для интеграции требуется библиотекаthymeleaf-spring.

Добавьте следующие зависимости в файл Maven POM:


    org.thymeleaf
    thymeleaf
    3.0.9.RELEASE


    org.thymeleaf
    thymeleaf-spring4
    3.0.9.RELEASE

Обратите внимание, что для проекта Spring 4 библиотекаthymeleaf-spring4 должна использоваться вместоthymeleaf-spring5.

КлассSpringTemplateEngine выполняет все шаги настройки. Вы можете настроить этот класс как компонент в файле конфигурации Java:

@Bean
@Description("Thymeleaf Template Resolver")
public ServletContextTemplateResolver templateResolver() {
    ServletContextTemplateResolver templateResolver = new ServletContextTemplateResolver();
    templateResolver.setPrefix("/WEB-INF/views/");
    templateResolver.setSuffix(".html");
    templateResolver.setTemplateMode("HTML5");

    return templateResolver;
}

@Bean
@Description("Thymeleaf Template Engine")
public SpringTemplateEngine templateEngine() {
    SpringTemplateEngine templateEngine = new SpringTemplateEngine();
    templateEngine.setTemplateResolver(templateResolver());
    templateEngine.setTemplateEngineMessageSource(messageSource());
    return templateEngine;
}

Свойства bean-компонентаtemplateResolverprefix иsuffix указывают местоположение страниц просмотра в каталогеwebapp и их расширение имени файла, соответственно.

ИнтерфейсViewResolver в Spring MVC сопоставляет имена представлений, возвращаемых контроллером, с фактическими объектами представления. ThymeleafViewResolver реализует интерфейсViewResolver и используется для определения представлений Thymeleaf для визуализации с учетом имени представления.

Последний шаг в интеграции - добавитьThymeleafViewResolver в качестве bean-компонента:

@Bean
@Description("Thymeleaf View Resolver")
public ThymeleafViewResolver viewResolver() {
    ThymeleafViewResolver viewResolver = new ThymeleafViewResolver();
    viewResolver.setTemplateEngine(templateEngine());
    viewResolver.setOrder(1);
    return viewResolver;
}

3. Отображение значений из источника сообщения (файлы свойств)

Атрибут тегаth:text=”#{key}” может использоваться для отображения значений из файлов свойств. Чтобы это работало, файл свойств должен быть настроен как bean-компонентmessageSource:

@Bean
@Description("Spring Message Resolver")
public ResourceBundleMessageSource messageSource() {
    ResourceBundleMessageSource messageSource = new ResourceBundleMessageSource();
    messageSource.setBasename("messages");
    return messageSource;
}

Вот HTML-код Thymeleaf для отображения значения, связанного с ключомwelcome.message:

4. Отображение атрибутов модели

4.1. Простые атрибуты

Атрибут тегаth:text=”${attributename}” может использоваться для отображения значения атрибутов модели. Давайте добавим атрибут модели с именемserverTime в класс контроллера:

model.addAttribute("serverTime", dateFormat.format(new Date()));

HTML-код для отображения значения атрибутаserverTime:

Current time is

4.2. Атрибуты коллекции

Если атрибут модели представляет собой набор объектов, атрибут тегаth:each может использоваться для итерации по нему. Давайте определим класс моделиStudent с двумя полями,id иname:

public class Student implements Serializable {
    private Integer id;
    private String name;
    // standard getters and setters
}

Теперь мы добавим список студентов в качестве атрибута модели в классе контроллера:

List students = new ArrayList();
// logic to build student data
model.addAttribute("students", students);

Наконец, мы можем использовать код шаблона Thymeleaf для перебора списка студентов и отображения всех значений полей:

5. Условная оценка

5.1. if иunless

Атрибутth:if=”${condition}” используется для отображения части представления, если условие выполнено. Атрибутth:unless=”${condition}” используется для отображения части представления, если условие не выполняется.

Добавьте полеgender в модельStudent:

public class Student implements Serializable {
    private Integer id;
    private String name;
    private Character gender;

    // standard getters and setters
}

Предположим, в этом поле есть два возможных значения (M или F) для обозначения пола учащегося. Если мы хотим отобразить слова «мужчина» или «женщина» вместо одного символа, мы можем выполнить это, используя следующий код Thymeleaf:

5.2. switch иcase

Атрибутыth:switch иth:case используются для условного отображения содержимого с использованием структуры оператора switch.

Предыдущий код можно переписать с использованием атрибутовth:switch иth:case:

6. Обработка пользовательского ввода

Ввод формы можно обрабатывать с помощью атрибутовth:action=”@{url}” иth:object=”${object}”. th:action используется для предоставления URL-адреса действия формы, аth:object используется для указания объекта, к которому будут привязаны отправленные данные формы. Отдельные поля отображаются с помощью атрибутаth:field=”*{name}”, гдеname - это свойство соответствия объекта.

Для классаStudent мы можем создать форму ввода:

В приведенном выше коде/saveStudent - это URL-адрес действия формы, аstudent - это объект, содержащий отправленные данные формы.

КлассStudentController обрабатывает отправку формы:

@Controller
public class StudentController {
    @RequestMapping(value = "/saveStudent", method = RequestMethod.POST)
    public String saveStudent(@ModelAttribute Student student, BindingResult errors, Model model) {
        // logic to process input data
    }
}

В приведенном выше коде аннотация@RequestMapping отображает метод контроллера с URL-адресом, указанным в форме. Аннотированный методsaveStudent() выполняет необходимую обработку для отправленной формы. Аннотация@ModelAttribute связывает поля формы с объектомstudent.

7. Отображение ошибок проверки

Функцию#fields.hasErrors() можно использовать для проверки наличия в поле ошибок проверки. Функцию#fields.errors() можно использовать для отображения ошибок в конкретном поле. Имя поля является входным параметром для обеих этих функций.

HTML-код для итерации и отображения ошибок для каждого из полей в форме:

Вместо имени поля вышеуказанные функции принимают подстановочный знак* или константуall для обозначения всех полей. Атрибутth:each используется для итерации нескольких ошибок, которые могут присутствовать для каждого из полей.

Предыдущий HTML-код переписан с использованием подстановочного знака*:

или используя константуall:

Точно так же глобальные ошибки в Spring могут отображаться с помощью константыglobal.

HTML-код для отображения глобальных ошибок:

Атрибутth:errors также можно использовать для отображения сообщений об ошибках. Предыдущий код для отображения ошибок в форме можно переписать с помощью атрибутаth:errors:

8. Использование конверсий

Синтаксис двойной скобки\{\{}} используется для форматирования данных для отображения. Это используетformatters, настроенный для этого типа поля в bean-компонентеconversionService контекстного файла.

Поле имени в классеStudent форматируется:

В приведенном выше коде используется классNameFormatter, настроенный путем переопределения методаaddFormatters() из интерфейсаWebMvcConfigurer. Для этого наш класс@Configuration переопределяет классWebMvcConfigurerAdapter:

@Configuration
public class WebMVCConfig extends WebMvcConfigurerAdapter {
    // ...
    @Override
    @Description("Custom Conversion Service")
    public void addFormatters(FormatterRegistry registry) {
        registry.addFormatter(new NameFormatter());
    }
}

КлассNameFormatter реализует интерфейс SpringFormatter.

Утилиту#conversions также можно использовать для преобразования объектов для отображения. Синтаксис функции полезности:#conversions.convert(Object, Class), гдеObject преобразуется в типClass.

Чтобы отобразить поле объектаstudentpercentage с удаленной дробной частью:

9. Заключение

В этом руководстве мы увидели, как интегрировать и использовать Thymeleaf в приложении Spring MVC.

Мы также видели примеры того, как отображать поля, принимать ввод, отображать ошибки проверки и преобразовывать данные для отображения. Рабочая версия кода, показанного в этой статье, доступна вa GitHub repository.

TOC

Введение в использование Thymeleaf весной