Angular 10 formatDate()方法

在这篇文章中，我们将看到什么是Angular 10中的 formatDate，以及如何使用它。 formatDate是用来根据地区规则对日期进行标记的。

语法:

formatDate(value, locale, format, timezone)

参数:

• value：要格式化的数字。
• locale：一个地区性的代码，用于地区性的格式。
• format：要包括的日期-时间成分。
• timezone：该地的时区。

返回值:

• string：格式化的日期字符串。

NgModule: formatDate使用的模块是。

• CommonModule

步骤：

• 创建要使用的Angular应用程序。
• 在app.module.ts中导入LOCALE_ID，因为我们需要导入locale来使用get formatDate。

import { LOCALE_ID, NgModule } from '@angular/core';

• 在app.component.ts中导入 formatDate 和 LOCALE_ID。
• 注入LOCALE_ID作为一个公共变量。
• 在app.component.html中使用字符串插值显示局部变量
• 使用ng serve为angular应用程序提供服务，以查看输出。

示例 1:

import {
  formatDate
 }
  from '@angular/common';
  
import {Component,
  Inject,
  LOCALE_ID }
  from '@angular/core';
  
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
curr = formatDate("02-feburary-0202", 'dd-MM-yyyy' ,this.locale);
constructor(
  @Inject(LOCALE_ID) public locale: string,){}
}

<h1>
  GeeksforGeeks
</h1>
  
<p>Locale Date is : {{curr}}</p>

输出:

示例 2:

import {
  formatDate
 }
  from '@angular/common';
  
import {Component,
  Inject,
  LOCALE_ID }
  from '@angular/core';
  
@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent {
curr = formatDate("03-march-0303", 'yyyy-dd-MM' ,this.locale);
constructor(
  @Inject(LOCALE_ID) public locale: string,){}
}

<h1>
  GeeksforGeeks
</h1>
  
<p>Locale Date is : {{curr}}</p>

输出: