Переменные тимьянаф

1. Введение

В этом учебнике, мы собираемся взглянуть на переменные в Thymeleaf . Мы создадим пример Spring Boot, который получит список статей Baeldung и отобразить их в HTML-шаблоне Thymeleaf.

2. Мейвен зависимостей

Чтобы работать с Thymeleaf, нам нужно добавить весна-загрузка-стартер-тимьян- и весна-загрузка-стартер-веб- Зависимости:


    org.springframework.boot
    spring-boot-starter-thymeleaf


    org.springframework.boot
    spring-boot-starter-web

3. Веб-контроллер

Во-первых, мы создадим веб-контроллер с конечной точкой GET, который возвращает страницу со списком статей Baeldung.

Метод аннотирован @GetMapping займет один параметр – Модель . Он содержит все глобальные переменные, которые могут быть использованы в шаблоне Thymeleaf. В нашем случае модель будет иметь только один параметр – список статей.

Статья класс будет состоять из двух Струнные поля, имя и URL :

public class Article {
    private String name;
    private String url;

    // constructor, getters and setters
}

Значение возврата метода нашего контроллера должно быть именем желаемого шаблона Thymeleaf. Это имя должно соответствовать HTML-файлу, расположенному в src/ресурс/шаблон каталог. В нашем случае, это будет src/resource/template/articles-list.html .

Давайте кратко рассмотрим наш контроллер Весна:

@Controller
@RequestMapping("/api/articles")
public class ArticlesController {

    @GetMapping
    public String allArticles(Model model) {
        model.addAttribute("articles", fetchArticles());
        return "articles-list";
    }

    private List fetchArticles() {
        return Arrays.asList(
          new Article(
            "Introduction to Using Thymeleaf in Spring",
            "https://www.baeldung.com/thymeleaf-in-spring-mvc"
          ),
          // a few other articles
        );
    }
}

После запуска приложения страница статей будет доступна по http://localhost:8080/articles .

4. Шаблон тимьяна

Теперь перейдем к HTML-шаблону Thymeleaf. Он должен иметь стандартную структуру HTML-документа только с дополнительным определением пространства имен Thymeleaf:

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

тег:





    Thymeleaf Variables
    


    
        ...

5. Определить переменные

Есть два способа определить переменную в шаблоне Thymeleaf. Первый вариант заключается в том, чтобы взять один элемент во время итерации над массивом:

В результате мы получим

с несколькими элементы, соответствующие количеству статей в статьях переменными.

Другой способ заключается в определении новой переменной на основе другой. Например, мы можем взять первый элемент массива статей:

Или мы можем создать новую переменную, которая содержит только название статьи:

В приведенной выше примере $article.name и $(статьяИмя) фрагменты заменяемы.

Также можно определить несколько переменных. Например, мы можем создать две отдельные переменные для имя статьи и URL:

6. Область переменных

Переменные передаются в Модель в контроллере имеют глобальный охват. Это означает, что они могут быть использованы в любом месте наших HTML шаблонов.

С другой стороны, переменные, определенные в шаблоне HTML, имеют локальный охват. Они могут быть использованы только в пределах диапазона элемента, в который они были определены.

Например, приведенный ниже код является правильным, как элемент находится в первомDiv :

С другой стороны, когда мы пытаемся использовать первыйАртикл в другом div :

Мы получим исключение во время компиляции времени, сказав, что первыйАртикл это нулевой :

org.springframework.expression.spel.SpelEvaluationException: EL1007E: Property or field 'name' cannot be found on null

Это потому, что

элемент пытается использовать переменную, определяемую в , которая выходит за рамки.

Если нам все еще нужно использовать первыйАртикл переменная внутри secondDiv , мы должны были бы определить его еще раз в secondDiv или оберните эти два div теги в общем элементе и определить первыйАртикл в нем.

7. Изменение значения переменной

Также можно переписать значение переменной в данной области:

В приведенной выше примере мы пересмотрели статьи переменной, чтобы иметь только два первых элемента.

Обратите внимание, что за пределами mainDiv, статьи переменная будет по-прежнему иметь свое первоначальное значение, передаваемое в контроллере.

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

В этом учебнике мы узнали, как определить и использовать переменные в Thymeleaf. Как всегда, весь исходный код доступен более на GitHub .