Las expresiones $
permiten acceder a variables del modelo. Son útiles para mostrar datos dinámicos en las plantillas HTML.
<p th:text="${nombre}">Nombre por defecto</p>
Explicación: En este ejemplo, el valor de la variable nombre
se sustituirá en el elemento p
. Si la variable tiene el valor "Juan", el HTML final será:
<p>Juan</p>
Las expresiones #
se utilizan para acceder a mensajes de internacionalización en archivos de propiedades.
<p th:text="#{mensaje.bienvenida}">Bienvenida por defecto</p>
Explicación: Aquí, la expresión #{mensaje.bienvenida}
busca la clave mensaje.bienvenida
en un archivo de propiedades (por ejemplo, messages.properties
). El texto en ese archivo reemplaza la expresión en el HTML.
Las expresiones @
permiten generar URLs dinámicas dentro de las plantillas Thymeleaf. Se pueden incluir rutas y parámetros.
<a th:href="@{/usuarios}">Ver Usuarios</a>
Explicación: En este caso, @{/usuarios}
genera dinámicamente la URL para el enlace. Si la aplicación está desplegada en http://localhost:8080
, el HTML generado sería:
<a href="/usuarios">Ver Usuarios</a>
A continuación se muestra un ejemplo que utiliza las tres expresiones ($, #, y @) juntas:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Página de Ejemplo</title>
</head>
<body>
<h1 th:text="${titulo}">Título de la Página</h1>
<p th:text="#{mensaje.bienvenida}">Bienvenida por defecto</p>
<a th:href="@{/usuarios}">Ver Usuarios</a>
</body>
</html>
Explicación: Este ejemplo muestra cómo las tres expresiones trabajan juntas:
$
muestra el valor de una variable del modelo.#
inserta un mensaje internacionalizado.@
genera un enlace dinámico dentro del contexto de la aplicación.