Angular 10 formatDate() 方法

Angular 10提供了许多便利的内置函数来处理日期和时间，其中之一就是formatDate()方法。 formatDate()方法允许您格式化日期并将其输出为指定格式的字符串。 它是Angular 10框架的一部分，通过使用@angular/common导入使用。

语法

formatDate(dateInput: string | number | Date, format: string, locale: string, timezone?: string): string

• dateInput： 要格式化的日期输入。 这可以是任何支持的日期格式，如字符串、数字或日期对象。
• format：指定输出格式的字符串。 根据您的需要，您可以创建任何自定义格式。
• locale：特定于语言环境的上下文信息，例如日期和时间格式（如"en-US"或"de-DE"）。
• timezone ：（可选参数）您可以指定一个时区。 这允许您在本地上下文之外处理其他时区中的日期和时间。

示例

下面是formatDate()方法的一些示例：

import { formatDate } from '@angular/common';
 
const date=new Date('2021/04/10 09:05:00');

// 1) 格式化日期为 'yyyy/MM/dd'
const formattedDate = formatDate(date, 'yyyy/MM/dd', 'en-US');
console.log(formattedDate); //输出 2021/04/10

// 2) 格式化日期为 'MMM dd, y'
const formattedDate = formatDate(date, 'MMM dd, y', 'en-US');
console.log(formattedDate); //输出 Apr 10, 2021

// 3) 在带有时区的情况下格式化日期
const formattedDate = formatDate(date, 'MMM dd, y H:mm:ss a zzzz', 'en-US', 'GMT+8');
console.log(formattedDate); //输出 Apr 10, 2021 17:05:00 PM China Standard Time

输出格式的选项

您可以使用以下格式码创建指定的日期格式：

• y ：完整的年份（如：2021）
• yy ：2位数的年份表示形式（如：21）
• M：月份（1-12）
• MM：带前导零的月份表示（如：04）
• MMM：缩写的月份的文本表示形式（如：Apr）
• MMMM：完整文本的月份表示形式（如：April）
• d：一个月的第几天（1-31）
• dd：以前导零的一个月的天数（如：01）
• EEE：缩写的星期几表示（如：Sat）
• EEEE：完整文本的星期几表示（如：Saturday）
• H ：24小时时钟表示形式的小时数（0-23）
• HH：24小时时钟表示形式的小时数，前导零（例如：09）
• h ：12小时时钟表示形式的小时数（0-12）
• hh：12小时时钟表示形式的小时数，前导零（例如：09）
• m ：分钟数（0-59）
• mm：以前导零的分钟数（如：05）
• s ：秒数（0-59）
• ss：以前导零的秒数（如：03）
• a ：上午/下午的符号（如：AM或PM）
• zzz ：时区（如：UTC+8）
• zzzz ：时区的完整名称（如：China Standard Time）

总结

formatDate()方法是一个非常实用的内置函数，它允许您在Angular应用程序中轻松处理日期和时间的格式化。 您可以使用不同的输出格式，并根据需要进行设置和使用。 因此，这是Angular 10中必不可少的一个特性。