1. Обзор
В этом кратком руководстве мы увидим, как мы можем использовать массивы в Thymeleaf. Для простоты настройки мы собираемся использовать инициализатор spring-boot для начальной загрузки нашего приложения.
Основы Spring MVC и Thymeleaf можно найти здесь .
2. Зависимость от листьев тимьяна
В нашем файле pom.xml
нам нужно добавить только зависимости SpringMVC и Thymeleaf:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
3. Контроллер
Для простоты давайте воспользуемся контроллером только с одним методом, который обрабатывает запросы GET .
Это отвечает передачей массива объекту модели, который сделает его доступным для представления:
@Controller
public class ThymeleafArrayController {
@GetMapping("/arrays")
public String arrayController(Model model) {
String[] continents = {
"Africa", "Antarctica", "Asia", "Australia",
"Europe", "North America", "Sourth America"
};
model.addAttribute("continents", continents);
return "continents";
}
}
4. Вид
На странице просмотра мы собираемся получить доступ к массиву континентов
по имени, которое мы передаем (континенты) из нашего контроллера выше .
4.1. Свойства и индексы
Одним из первых свойств, которые мы собираемся проверить, является длина массива. Вот как мы можем это проверить:
<p>...<span th:text="${continents.length}"></span>...</p>
И глядя на приведенный выше фрагмент кода со страницы просмотра, мы должны заметить использование ключевого слова th:text
. Мы использовали его для вывода значения переменной внутри фигурных скобок, в данном случае длины массива.
Следовательно, мы получаем доступ к значению каждого элемента массива континентов
по его индексу точно так же, как мы это делаем в нашем обычном Java-коде :
<ol>
<li th:text="${continents[2]}"></li>
<li th:text="${continents[0]}"></li>
<li th:text="${continents[4]}"></li>
<li th:text="${continents[5]}"></li>
<li th:text="${continents[6]}"></li>
<li th:text="${continents[3]}"></li>
<li th:text="${continents[1]}"></li>
</ol>
Как мы видели в приведенном выше фрагменте кода, каждый элемент доступен через его индекс. Мы можем перейти сюда, чтобы узнать больше о выражениях в Thymeleaf .
4.2. Итерация
Точно так же мы можем последовательно перебирать элементы массива .
Вот как мы можем этого добиться в Thymeleaf:
<ul th:each="continet : ${continents}">
<li th:text="${continent}"></li>
</ul>
При использовании ключевого слова th:each
для перебора элемента массива мы не ограничены использованием только тегов списка. Мы можем использовать любой тег HTML, способный отображать текст на странице. Например:
<h4 th:each="continent : ${continents}" th:text="${continent}"></h4>
В приведенном выше фрагменте кода каждый элемент будет отображаться в отдельном теге <h4></h4>
.
4.3. Вспомогательные функции
Наконец, мы собираемся использовать функции служебного класса для изучения некоторых других свойств массива.
Давайте посмотрим на это:
<p>The greatest <span th:text="${#arrays.length(continents)}"></span> continents.</p>
<p>Europe is a continent: <span th:text="${#arrays.contains(continents, 'Europe')}"></span>.</p>
<p>Array of continents is empty <span th:text="${#arrays.isEmpty(continents)}"></span>.</p>
Сначала мы запрашиваем длину массива, а затем проверяем, является ли Европа
элементом массива континентов.
Наконец, мы проверяем, пуст ли массив континентов .
5. Вывод
В этой статье мы узнали, как работать с массивом в Thymeleaf , проверяя его длину и обращаясь к его элементам с помощью индекса. Мы также научились перебирать его элементы в Thymeleaf.
Наконец, мы видели использование служебных функций для проверки других свойств массива.
И, как всегда, полный исходный код этой статьи можно найти на Github .