在Thymeleaf中格式化日期
Posted allway2
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在Thymeleaf中格式化日期相关的知识,希望对你有一定的参考价值。
1. 简介
在本文中,我们将介绍在百里香叶模板中格式化日期的方法。我们将使用 Thymeleaf 引擎中提供的特殊#calendars实用程序,该实用程序是为模板上的日期操作而创建的。
2. 使用实用程序类#calendar
Thymeleaf带有一个名为#calendars的特殊实用程序类,可以在表达式语句中用于格式化日期。
以下代码显示了具有特定模式的日期格式设置示例:
复制$#calendars.format(cal, 'dd/MMM/yyyy HH:mm')
在模式中,我们可以使用以下字母(与SimpleDateFormat模式非常相似):
复制G - Era designator (before christ, after christ)
y - Year (e.g. 12 or 2012). Use either yy or yyyy.
M - Month in the year. Number of M's determine length of format (e.g. MM, MMM or MMMMM)
d - Day in a month. Number of d's determine length of format (e.g. d or dd)
h - Hour of the day, 1-12 (AM / PM) (normally hh)
H - Hour of the day, 0-23 (normally HH)
m - Minute in an hour, 0-59 (normally mm)
s - Second in a minute, 0-59 (normally ss)
S - Millisecond in second, 0-999 (normally SSS)
E - Day in a week (e.g Monday, Tuesday, etc.)
D - Day in the year (1-366)
F - Day of week in the month (e.g. 1st Thursday of December)
w - Week in the year (1-53)
W - Week in a month (0-5)
a - AM / PM marker
k - Hour in day (1-24, unlike HH's 0-23)
K - Hour in day, AM / PM (0-11)
z - Time Zone
3. 现实生活中的例子
现在让我们在实际应用程序中使用#calendars实用程序类。
项目结构如下:
复制── pom.xml
├── src
│ ├── main
│ │ ├── java
│ │ │ └── com
│ │ │ └── frontbackend
│ │ │ └── thymeleaf
│ │ │ ├── Application.java
│ │ │ ├── config
│ │ │ │ └── WebConfig.java
│ │ │ └── controller
│ │ │ └── IndexController.java
│ │ └── resources
│ │ ├── messages_en_US.properties
│ │ ├── messages_es.properties
│ │ ├── messages.properties
│ │ └── templates
│ │ └── index.html
对根上下文的所有GET请求都由 处理。此外,我们使用日期设置变量。我们将使用此变量通过更改区域设置来检查格式将如何更改。IndexController
exampleDate
20/06/2020
package com.frontbackend.thymeleaf.controller;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
@RequestMapping("/")
public class IndexController
private final static SimpleDateFormat sdf = new SimpleDateFormat("dd/MM/yyyy");
@GetMapping
public String main(Model model) throws ParseException
model.addAttribute("exampleDate", sdf.parse("20/06/2020"));
return "index";
WebConfig
class is used to change default Spring Boot locale configuration and to set - that will handle language change initialized on the frontend.LocaleChangeInterceptor
package com.frontbackend.thymeleaf.config;
import java.util.Locale;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.LocaleResolver;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
import org.springframework.web.servlet.i18n.LocaleChangeInterceptor;
import org.springframework.web.servlet.i18n.SessionLocaleResolver;
@Configuration
public class WebConfig implements WebMvcConfigurer
@Bean
public LocaleResolver localeResolver()
SessionLocaleResolver localeResolver = new SessionLocaleResolver();
localeResolver.setDefaultLocale(Locale.US);
return localeResolver;
@Bean
public LocaleChangeInterceptor localeChangeInterceptor()
LocaleChangeInterceptor localeChangeInterceptor = new LocaleChangeInterceptor();
localeChangeInterceptor.setParamName("lang");
return localeChangeInterceptor;
@Override
public void addInterceptors(InterceptorRegistry registry)
registry.addInterceptor(localeChangeInterceptor());
Message bundle for localized messages has the following content:
messages.properties:
Copyhome.title=Title
date.format=MM/dd/yyyy
messages_es.properties
Copyhome.title=Título
date.format=dd/MM/yyyy
Finally our Thymeleaf template - :index.html
<!DOCTYPE HTML>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8"/>
<title>Spring Boot Thymeleaf Application - Bootstrap Date Format</title>
<link th:rel="stylesheet" th:href="@assets/bootstrap-slider/css/bootstrap-slider.css"/>
<link th:rel="stylesheet" th:href="@webjars/bootstrap/4.0.0-2/css/bootstrap.min.css "/>
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark static-top">
<div class="container">
<a class="navbar-brand" href="/">Thymeleaf - Bootstrap Date Format</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive"
aria-controls="navbarResponsive"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home
<span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
th:text="$#strings.toUpperCase(#locale)">
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" th:href="@/(lang=en)">English</a>
<a class="dropdown-item" th:href="@/(lang=es)">Spanish</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<div class="container">
<div class="row">
<div class="col mt-5">
<h1 th:text="#home.title"></h1>
<div th:with="df=#date.format">Date formatted by locale: <strong
th:text="$#calendars.format(exampleDate,df)"></strong></div>
<div>Custom date format 1: <strong
th:text="$#calendars.format(exampleDate,'yyyy.MM.dd G, HH:mm:ss z')"></strong></div>
<div>Custom date format 2: <strong
th:text="$#calendars.format(exampleDate,'yyyy-MM-dd HH:mm:ss.SSSZ')"></strong></div>
<div>Custom date format 3: <strong
th:text="$#calendars.format(exampleDate,'EEE, d MMM yyyy HH:mm:ss Z')"></strong></div>
</div>
</div>
</div>
<script th:src="@/webjars/jquery/jquery.min.js"></script>
<script th:src="@/webjars/popper.js/umd/popper.min.js"></script>
<script th:src="@/webjars/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
我们使用区域设置变量来设置具有本地化日期格式的对象。df
<div th:with="df=#date.format">Date formatted by locale: <strong
th:text="$#calendars.format(exampleDate,df)"></strong></div>
该应用程序具有以下功能:
4. 结论
在本文中,我们介绍了如何在百里香叶模板中格式化日期。我们使用了一个示例 Spring Boot 应用程序,并更改了默认区域设置配置,以展示如何使用与区域设置相关的日期格式。
像往常一样,本文中使用的代码可在我们的GitHub 存储库下找到
在 Thymeleaf 中格式化 th:field
【中文标题】在 Thymeleaf 中格式化 th:field【英文标题】:Formatting th:field in Thymeleaf 【发布时间】:2013-12-20 03:10:32 【问题描述】:我在 Thymeleaf 中有一个表单输入字段。该字段(下面的代码 sn-p 中的 bookingEntry.datefrom)是 Date 类型。我使用日期选择器来允许用户选择和格式化输入字段所需的日期。这一切都很好。
但是,我希望日期的初始值(我已设置为当前日期)以我选择的格式显示。那么,如何格式化最初显示在 th:field 中的日期。 th:value 被忽略(Thymeleaf 应该从支持对象获取值),我似乎无法将格式应用于 th:field。
Thymeleaf 代码是:
<input type="text" class="form-control getdate"
th:field="*datefrom" placeholder="Date From"
th:value="$#dates.format(bookingEntry.datefrom, 'dd-MMM-yyyy')"/>
我确信我可以使用以我选择的任何格式初始化的 String,而不是 Date 类型,但我想知道是否有办法在 th:field 中格式化初始值?
非常感谢
【问题讨论】:
【参考方案1】:我错过了简单的答案,仅仅是因为我对 Spring 的了解有限。我在这里添加它,以防它帮助像我这样的其他新手。
传递给表单的对象中的元素上的@DateTimeFormat
注释完成了这项工作。它确保Date
对象以您希望的方式格式化(无论您是否使用Thymeleaf)。
在上面的示例中,在bookingEntry
对象内
@Temporal(DATE)
@DateTimeFormat (pattern="dd-MMM-YYYY")
private Date datefrom;
【讨论】:
我也错过了这个解决方案。当我使用 jquery ajax 提交 thymeleaf 表单时,它也可以工作,并且由于 Thymeleaf 中不支持的默认格式,Jackson 无法将日期值反序列化为 java.util.Date。 这对我不起作用。当我使用空值提交表单时,表单提交会解析空日期,但是当我使用日期提交时,匹配 DateTimeFormat 注释中的样式,我收到“错误请求,验证失败”错误,状态 400。跨度> 在用尽了许多其他尝试之后,就像一个魅力。顺便说一句,对于 2015 年 3 月 14 日类型的日期,BTW 模式应为“MM/d/yyyy”。 老兄...谢谢你,我现在感觉自己像个白痴xD【参考方案2】:如果你的日期为空,它会给你错误。我们必须在解析日期之前检查值。
<input type="text" name="date"
th:value="$user.dateOfBirth?$#dates.format(user.dateOfBirth, 'dd-MM-yyyy'):''"
placeholder="dd-mm-yyyy" id="pickyDate"/>
【讨论】:
以上是关于在Thymeleaf中格式化日期的主要内容,如果未能解决你的问题,请参考以下文章
使用thymeleaf框架,前台日期格式是字符串,后台不能以Date格式接收解决
如何使用 Thymeleaf 和/或 spring 表达式语言来转换字符串,例如“2018-02-21”转换为日期格式 dd/mm/yyyy(例如“21/02/2018”)
SpringBoot +Thymeleaf 提交字符串日期类型 提示Failed to convert property value of type ‘java.lang.String‘