Débuter rapidement avec Thymeleaf
Thymeleaf est un moteur de template côté serveur. Tel que JSP, JSF, les pages sont généré sur le serveur. Ce moteur est entièrement supporté par Spring Boot.Il est majoritairement utilisé dans des applications, mais il peut être utilisé dans la construction de page pdf ou bien de courriel.
Thymeleaf utilise des pages html auquel des marqueurs (commande) sont ajouté pour aider le moteur à faire certain traitement.
Les exemples utilisés sont basé sur un projet en spring boot 2.2
public class User { private String firstname; public User(){public String getFirstname() { return firstname; } public void setFirstname(String firstname) { this.firstname = firstname; }}
@Controller
public class UserController {
private final UserService userService;
public UserController(final UserService userService){
this.userService=userService;
}
@GetMapping(value="/userlist")
public String userList(Model model) {
List<User> usersList = userService.findAll();
model.addAttribute("users", usersList);
return "userList";
}
}
Le fichier html
<!DOCTYPE html>
<html>
<head>
<title>User list</title>
</head>
<body>
<table>
<tr th:each="user : ${users}">
<td th:text="#{firstname}"></td>
<td th:text="${user.firstname}"></td>
</tr>
</table>
</body>
</html>
th:each et th:text sont des marqueurs. Le premier permet de boucler sur la listes de users alors que le second permet d'afficher.
Au niveau du contrôleur, la variable usersList est mise dans le modèle avec le nom users.
Dans le fichier html, on y accède en bouclant sur la même variable avec la syntaxe ${nom de ma variable}.
L'usage #{...} permet d'avoir accès au fichier d'internalisation.
- messages.properties
- messages_en.properties
Dans le fichier messages.properties
firstname=Prénom
et dans le fichier messages_en.properties
firstname=Firstname.
Condition
L'opérateur Elvis est disponible avec la même notation.Condition ? true : false
Si la valeur du firstname est Paul alors son fond de couleur sera blanc.
Afin que ça puisse fonctionner, il faut utiliser le marqueur th:style.
<!DOCTYPE html>
<html>
<head>
<title>User list</title>
</head>
<body>
<table>
<tr th:each="user : ${users}">
<td th:text="#{firstname}"></td>
<td th:text="${user.firstname}" th:style="${user.firstname=='Paul'} ? 'background: #ffffff' : ''"></td>
</tr>
</table>
</body>
</html>
Un projet basique est disponible.
Aucun commentaire:
Enregistrer un commentaire