Expresiones de hoja de tomillo
Esta sección presenta varias expresiones de Thymeleaf y demuestra las expresiones y el uso de Thymeleaf a través de algunos ejemplos simples.
1. Expresión variable
Una expresión variable es una expresión para obtener variables de fondo. Use ${} para obtener el valor de una variable, por ejemplo:
<p th:text="${name}">hello</p>
En el ejemplo anterior, ${name} se usa para obtener los atributos del modelo devuelto por el fondo. El atributo th:text en la etiqueta se usa para completar el contenido de la etiqueta.
Si el objeto se devuelve en segundo plano, utilice el método nombre de variable nombre de atributo para obtenerlo, que es lo mismo que la expresión EL.
<p th:text="${user.memo}">备注</p>
En el ejemplo anterior, use ${user.memo} para obtener la propiedad memo del objeto de usuario en el modelo.
2. Expresión de selección o estrella
Una expresión de selección es similar a una expresión de variable, pero ejecuta *{name} con un objeto preseleccionado en lugar del contenedor de variables de contexto (mapa). ¿Qué son los objetos preseleccionados? es el valor de la etiqueta principal. El código de ejemplo es el siguiente:
<div th:object="${session.user}">
<p>Name: <span th:text="*{firstName}">Sebastian</span>.</p>
<p>Surname: <span th:text="*{lastName}">Pepper</span>.</p>
<p>Nationality: <span th: text="*{nationality}">Saturn</span>.</p>
</div>
// 等价于<div>
<p>Name: <span th:text="${session.user.firstName}">Sebastian</span>.</p>
<p>Surname: <span th:text="${session.user.lastName}">Pepper</span>.</p>
<p>Nationality: <span th:text="${session.user.nationality}">Saturn</span>.</p>
</div>
En el ejemplo anterior, predefinimos la variable de objeto con th:object ${session.user}y luego usamos el asterisco （*）para obtener los diversos atributos en la variable de usuario. Por ejemplo, *{firstName}es equivalente a ${session.user.firstName}. La diferencia entre los dos usos es la siguiente:
1) No hay diferencia entre los dos, independientemente del contexto, excepto que la evaluación de sintaxis de asterisco se expresa en el objeto seleccionado, no en todo el contexto.
2) La sintaxis de signo de dólar ($) y asterisco (*) se puede mezclar.
3. Expresiones de URL
La URL ocupa una posición muy importante en las aplicaciones web, como la referencia a archivos de recursos estáticos, el procesamiento de enlaces de URL, etc. Thymeleaf procesa expresiones URL a través de la sintaxis @{…}, principalmente utilizando th:href, th:src y otros atributos para hacer referencia a archivos de recursos estáticos como CSS y JS. Los siguientes ejemplos demuestran el uso de expresiones URL.
3.1 Importar archivos de recursos estáticos
Las páginas de Thymeleaf usan el atributo th:href para importar archivos de recursos CSS:
<link rel="stylesheet" th:href="@(/resources/css/bootstrap.min.css)"/>
En el ejemplo anterior, se accede de forma predeterminada a la carpeta css en recursos.
Las páginas de Thymeleaf usan el atributo th:src para importar archivos de recursos JS:
<script th:src="@{/resource/js/bootstrap.min.js]"></script>
De forma predeterminada, se accede a la carpeta js en recursos.
3.2 Use @{…} para configurar la imagen de fondo
<div th:style="'background:url('+ @{${imgurl}} +');'"></div>
La ruta anterior usa @{${imgurl} para especificar la ruta de la imagen, y Thymeleaf también establece el fondo a través de th:background.
3.3 URL de enlace
Thymeleaf admite <a>el uso de th:href en etiquetas para manejar enlaces URL:
<a th:href="@{http://www.a.com/user/u123456}">绝对路径</a>
<a th:href="@{/order}">相对路径</a>
En el ejemplo anterior, el modificador de atributo th:href evaluará y reemplazará el valor de URL vinculado con href en el atributo href.
De manera similar, th:href también admite el paso de parámetros de URL, podemos usar expresiones de URL con parámetros, los ejemplos son los siguientes:
<a th:href="@{/order/details(orderId=${orderId})}">view</a>
En el ejemplo anterior, la expresión @{…} accede a la variable orderId en el contexto a través de {orderId}. El último (orderId=${o.id}) indica que el contenido entre paréntesis se tratará como parámetros de URL. Esta sintaxis evita el uso de "&" para unir parámetros de URL, lo que mejora enormemente la legibilidad.
Si se requieren varios parámetros, estarán separados por comas, por ejemplo:
<a th:href="@{/order/process(execId=${execId},execType='FAST')}">view</a>
En el ejemplo anterior, usar la expresión @{} para crear la URL y pasar los dos parámetros execId y execType al mismo tiempo es más simple y fácil de leer que usar la concatenación "&".
4. Expresión de internacionalización de texto
Las expresiones de internacionalización de texto nos permiten recuperar información de texto local de un archivo externo, usando expresiones como #{login.tip}. El siguiente ejemplo demuestra la internacionalización de Thymeleaf.
Paso 01 Crear recursos internacionalizados.
Spring Boot admite la internacionalización. Creamos una nueva carpeta i18n en el directorio de archivos de recursos de recursos, creamos dos archivos test_zh_CN.properties y test_en_US.properties en esta carpeta (también puede crear directamente la carpeta del paquete de recursos) y luego agregamos propiedades de prueba.
Creamos un archivo de configuración de recursos internacionalizado para la prueba, agregamos el atributo login.tip y configuramos el chino y el inglés correspondientes.
Paso 02 Modificar la configuración de internacionalización del sistema.
Agregue la configuración de internacionalización definida anteriormente a application.properties:
@spring.messages.basename=i18n.test
Paso 03 Referenciar recursos internacionalizados en la página.
Cree la página i18n.html en el directorio resource/templates, el código de ejemplo es el siguiente:
<!DOCTYPE htm1>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head lang="en">
<meta charset="UTF-8" />
<title></title>
</head>
<body>
<h1>Thymeleaf模板引擎</h1>
<h3>国际化</h3>
<p th:text="#{login.tip}">Please log in</p>
</body>
</htm1>
En el ejemplo anterior, la configuración de atributos se obtiene mediante la expresión de internacionalización literal #{login.tip}.
Paso 04 Cree una solicitud de fondo.
Agregue el siguiente código al HelloController anterior:
@RequestMapping("/i18n")
public String i18n() {
return "i18n";
}
Paso 05 Ejecute la prueba.
Una vez completada la configuración, inicie el proyecto y visite http://localhost:8080/i18n en el navegador para verificar si la configuración de internacionalización es efectiva.
A través de la expresión #{login.tip} se obtiene el contenido chino en la configuración de recursos internacionalizados.