Angular 10 DatePipe API

Angular 10 DatePipe API

在这篇文章中,我们将看到什么是Angular 10中的DatePipe以及如何使用它。

DatePipe用于根据地区规则格式化一个日期值。

语法:

{{ value | date }}

步骤:

  • 创建要使用的angular应用程序。
  • 对于要使用的DatePipe,不需要任何导入。
  • 在app.component.ts中定义获取日期值的变量。
  • 在app.component.html中使用上述语法来制作日期元素。
  • 使用ng serve为angular应用程序提供服务以查看输出。

参数:

  • 格式。它需要一个字符串值。
  • 时区。它需要一个字符串值。
  • locale。它需要一个字符串值。

示例 1:

import { Component, OnInit } 
from '@angular/core';
  
@Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
})
export class AppComponent {
    today: number = Date.now();
}
<p>Date {{today | date}}</p>
  
     
<p>Time {{today | date:'h:mm a z'}}</p>

输出:

Angular 10 DatePipe API

示例 2:

import { Component } from '@angular/core';
  
@Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
})
export class AppComponent {
    today: number = Date.now();
}
<p>Date {{today | date}}</p>
  
     
<p>Time {{today | date:'h:m:s'}}</p>

输出:

Angular 10 DatePipe API

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程