Java Thymeleaf, veja como enviar e exibir dados em seus templates

Neste artigo veremos como enviar informações de aplicação Spring Boot para serem exibidas em templates do Thyemeleaf.

Cleyson Lima 15 de março de 2021

No último artigo vimos o que é e quais as funcionalidades da template engine Thymeleaf. Vimos que ela facilita o nosso trabalho quando precisamos criar templates para aplicações Java.

Dando continuidade à nossa série de artigos sobre o Thymeleaf, agora veremos como enviar e exibir dados com o Thymeleaf em aplicações Spring Boot.

Aplicação base

Primeiramente vamos criar uma nova aplicação Spring Boot com a ajuda do Spring initializr, para isso acesse o site do Spring Initializr e preencha as metainformações.

Página do Spring Initializr com os meta dados da aplicação

  • Project: Maven Project
  • Language: Java
  • Spring Boot: 2.4.3
  • Group: br.com.treinaweb
  • Artifact: spring-thymelead-exemplo
  • Name: spring-thymelead-exemplo
  • Description: Exemplo Thymeleaf com Spring Boot
  • Package name: br.com.treinaweb.springthymeleafexemplo
  • Packaging: Jar
  • Java: 11

Agora que já definimos as metainformações do projeto, devemos informar quais as dependências que serão utilizadas no mesmo, iremos utilizar as dependências Spring Web e Thymeleaf.

Página com as dependências do projeto

Agora, com todas as informações preenchidas basta então clicar no botão “GENERATE” para que seja feito o download do projeto base, descompactar o arquivo baixado e então importa-lo para a IDE ou Editor de Código Fonte de sua preferência.

Enviando dados

Para que possamos enviar dados de uma aplicação Spring Boot para o Thymeleaf, antes é necessário criarmos um controller que será executado quando uma determinada rota for chamada pelo navegador, dessa maneira esse controller será responsável por enviar esses dados e definir qual o template do Thymeleaf deve ser exibido para o usuário.

Para criarmos o nosso controller, criaremos uma pasta que conterá os nossos arquivos Java da camada de controle. Dito isso crie uma pasta chamada controller dentro da pasta src/main/java/br/com/treinaweb/springthymeleafexample e por fim dentro da pasta recém criada crie um arquivo Java chamado HomeController.java com o seguinte código:

package br.com.treinaweb.springthymeleafexemplo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class HomeController {

    @GetMapping("/")
    public String home(ModelMap model) {
        model.addAttribute("nomeDoAtributo", "Treinaweb");

        return "home";
    }
}

Com o código acima nós estamos criando uma classe que faz parte da camada de controle com uma action que responde na rota / através do método HTTP GET.

Dentro da action home estamos adicionando um atributo que será recebido pelo template do Thymeleaf e por fim retornando o nome do template que queremos exibir quando tal rota for acessada pelo usuário.

Exibindo dados

Agora precisamos do nosso template a ser exibido, em aplicações Spring Boot os arquivos de template ficam contidos na pasta src/main/resources/templates, então dentro desta pasta criaremos um arquivo HTML chamado home.html com o seguinte código:

<!DOCTYPE html>
<html lang="pt-br">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Exemplo Spring Boot com Thymeleaf</title>
</head>
<body>
  <h1>Olá <span th:text="${nomeDoAtributo}"></span></h1>
</body>
</html>

Para exibirmos algum valor vindo do código Java que está executando o template, devemos utilizar uma propriedade especial do Thymeleaf chamada th:text e então como valor de tal propriedade colocar o nome do atributo que queremos exibir entre ${}.

Resultado

Para vermos o resultado, primeiro é necessário executar a aplicação, sendo assim, utilizaremos o comando mvn spring-boot:run e então acessamos a rota / de nossa aplicação que está sendo executada em http://localhost:8080.

Página que será exibida quando o projeto for executado

Conclusão

Em suma, neste artigo vimos como enviar e exibir dados com o Thymeleaf, recurso que facilita (e muito) o desenvolvimento dos nossos templates. No próximo artigo dessa série, veremos como utilizar estruturas de repetição e condição.

Deixe seu comentário

Conheça o autor desse artigo

  • Foto Autor Cleyson Lima
    Cleyson Lima

    Professor, programador, fã de One Piece e finge saber cozinhar. Cleyson é graduando em Licenciatura em Informática pelo IFPI - Campus Teresina Zona Sul, nos anos de 2019 e 2020 esteve envolvido em vários projetos coordenados pela secretaria municipal de educação da cidade de Teresina, onde o foco era introduzir alunos da rede pública no mundo da programação e robótica. Hoje é instrutor dos cursos de Spring na TreinaWeb, mas diz que seu coração sempre pertencerá ao Python.

    Posts desse Autor

Artigos relacionados