Thymeleaf Variable Expression

In this tutorial, we will learn Thymeleaf Variable Expression with an example.
Check out the complete Thymeleaf tutorials and examples at Thymeleaf Tutorial
Variable expressions are the most commonly used ones in the Thymeleaf templates. These expressions help bind the data from the template context(model) into the resulting HTML(view). 

Syntax: 
${VariableName}

Consider we have added data to the model in Spring MVC controller and in order to access the model data, we use the Thymeleaf Variable expressions. 

Variable Expressions Example

Let's create a Spring boot project using the spring initializr and add Spring Web and Thymeleaf dependencies:
		<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>

User Model Class

Next, let's create a User model class with the following content into it:
package net.javaguides.thymeleaf.model;

public class User {
    private String name;
    private String email;
    private String role;
    private String gender;

    public User(String name, String email, String role, String gender) {
        this.name = name;
        this.email = email;
        this.role = role;
        this.gender = gender;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    public String getRole() {
        return role;
    }

    public void setRole(String role) {
        this.role = role;
    }

    public String getGender() {
        return gender;
    }

    public void setGender(String gender) {
        this.gender = gender;
    }
}

Spring MVC Controller - UserController

Next, let's create a Spring MVC controller (UserController) with a handler method to return the Thymeleaf template like:
package net.javaguides.thymeleaf.controller;

import net.javaguides.thymeleaf.model.User;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class UserController {

    // handler method to handle variable-expression request
    @GetMapping("variable-expression")
    public String variableExpression(Model model){
        User user = new User("Ramesh", "ramesh@gmail.com", "ADMIN", "Male");
        model.addAttribute("user", user);
        return "variable-expression";
    }
}
Spring boot will auto-configure ViewResolver for Thymeleaf whenever it will find the springboot-thymeleaf-starter dependency on the classpath hence we don't have to manually configure ViewResolver for Thymeleaf.

Thymeleaf Template - variable-expression.html

Here is the Thymeleaf template that demonstrates the usage of variable expressions:
<!DOCTYPE html>
<html lang="en"
    xmlns:th="http://www.thymeleaf.org"
>
<head>
    <meta charset="UTF-8">
    <title>Variable Expressions</title>
</head>
<body>
<h1>Variable Expression Demo:</h1>
<h2>User Details:</h2>
<div>
    <p> Name: <strong th:text="${user.name}"></strong></p>
    <p> Email: <strong th:text="${user.email}"></strong></p>
    <p> Role: <strong th:text="${user.role}"></strong></p>
    <p> Gender: <strong th:text="${user.gender}"></strong></p>
</div>
</body>
</html>

Demo:

Run the Spring boot application and hit the below link in the browser:

Here is the output:

Related Thymeleaf Standard Expressions

  1. Thymeleaf Standard Expressions
  2. Thymeleaf th:text Attribute
  3. Thymeleaf Variable Expression
  4. Thymeleaf Selection Expression
  5. Thymeleaf Message Expression
  6. Thymeleaf Link Expression
  7. Thymeleaf Fragment Expression

Comments