angular中格式日期

如何在angular中对数据进行格式化操作
有两种方法
第一种是利用formatDate方法进行日期格式转换,另一种是利用datePipe管道进行日期数据处理

formatDate()方法

首先引入

import { formatDate } from '@angular/common'
import {Component,Inject,LOCALE_ID }from '@angular/core';

使用

formatDate(value :string|number|date,format:string,locale:string,timezone?:string):string

有四个参数 :

value: string|number|date 要格式化的日期,可以是一个日期,数字(从utc时代以来的ms数)或iso字符串
formate: string  格式详见下文
locale: string  一个区域代码 用来表示要使用的区域格式规则
timezone: string 时区

返回值是经过格式化的日期字符串
具体例子

html {{curr}}
curr = formatDate("02-feburary-0202", 'dd-MM-yyyy' ,this.locale);
constructor(
  @Inject(LOCALE_ID) public locale:string,){}
}

DatePipe管道

DatePipe:根据本地环境格式化日期数据

在html中使用

使用方法{{ value_expression | date [ : format [ : timezone [ : locale ] ] ] }}
value输入值 string | number | date
三个参数:

format string  可选 默认为'mediumDate'  日期格式
timezone string 可选 默认为undefined  时区
locale  string 可选 默认为undefined 

在ts中使用

引用

import { DatePipe } from '@angular/common'

使用方法

const today = this.DatePipe.transform(Date.now(), 'yyyy-MM-dd')

有一些默认配置好的日期格式

选项         相当于			实例
'short'	'M/d/yy, h:mm a'	6/15/15, 9:03 AM
'medium'	'MMM d, y, h:mm:ss a'	Jun 15, 2015, 9:03:01 AM
'long'	'MMMM d, y, h:mm:ss a z'	June 15, 2015 at 9:03:01 AM GMT+1
'full'	'EEEE, MMMM d, y, h:mm:ss a zzzz'	Monday, June 15, 2015 at 9:03:01 AM GMT+01:00
'shortDate'	'M/d/yy'	6/15/15
'mediumDate'	'MMM d, y'	Jun 15, 2015
'longDate'	'MMMM d, y'	June 15, 2015
'fullDate'	'EEEE, MMMM d, y'	Monday, June 15, 2015
'shortTime'	'h:mm a'	9:03 AM
'mediumTime'	'h:mm:ss a'	9:03:01 AM
'longTime'	'h:mm:ss a z'	9:03:01 AM GMT+1
'fullTime'	'h:mm:ss a zzzz'	9:03:01 AM GMT+01:00

你可能感兴趣的:(ng学习日志,angular.js,typescript,前端)