AngularJS 日期过滤器用法实例

AngularJS日期过滤器用于将日期转换为指定的格式。如果未指定日期格式, 则默认日期格式为" MMM d, yyyy"。
语法如下：

{{ date | date : format : timezone }}

参数值：日期过滤器包含可选的格式和时区参数。
格式中使用的一些常见值如下：

" YYYY"-定义年份ex。 2019年
" YY"-定义年份ex。 19
" Y"-定义年份ex。 2019年
" MMMM" –定义月份的月份。四月
" MMM" –定义月份前。四月
‘MM’–定义月份前04
‘dd’–定义日期ex。 09
" d"-定义除息日。 9
‘hh’–定义上午/下午的小时数
" h" –以AM / PM定义小时
毫米-定义分钟
" m" –定义分钟
" ss" –定义第二
" s" –定义第二

格式的一些预定义值如下：

"短" –相当于" M / d / yy h：mm a"
"中" –等同于" MMM d, y h：mm：ss a"
" shortDate" –等同于" M / d / yy"(5/7/19)
" mediumDate" –等同于" MMM d, y"(2019年5月7日)
" longDate" –等同于" MMMM d, y"(2019年5月7日)
" fullDate" –等效于" EEEE, MMMM d, y"(2019年5月7日, 星期二)
" shortTime" –相当于" h：mm a"(上午2:35)
" mediumTime" –等同于" h：mm：ss a"(上午2:35:05)

范例1：本示例以给定格式显示日期。

< !DOCTYPE html> < html > < head > < title > Date Filter< / title > < script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" > < / script > < / head > < body > < div ng-app = "gfgApp" ng-controller = "dateCntrl" > < p > {{ today | date : "dd.MM.y" }}< / p > < / div > < script > var app = angular.module('gfgApp', []); app.controller('dateCntrl', function($scope) { $scope.today = new Date(); }); < / script > < / body > < / html >

输出如下：

07.05.2019

范例2：本示例以指定的格式显示时间。

< !DOCTYPE html> < html > < head > < title > Date Filter< / title > < script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" > < / script > < / head > < body > < div ng-app = "gfgApp" ng-controller = "dateCntrl" > < p > {{ today| date : 'mediumTime'}}< / p > < / div > < script > var app = angular.module('gfgApp', []); app.controller('dateCntrl', function($scope) { $scope.today = new Date(); }); < / script > < / body > < / html >

输出如下：

2:37:23 AM

范例3：本示例以指定格式显示日期。

< !DOCTYPE html> < html > < head > < title > Date Filter< / title > < script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js" > < / script > < / head > < body > < div ng-app = "gfgApp" ng-controller = "dateCntrl" > < p > {{ today| date }}< / p > < / div > < script > var app = angular.module('gfgApp', []); app.controller('dateCntrl', function($scope) { $scope.today = new Date(); }); < / script > < / body > < / html >

【AngularJS 日期过滤器用法实例】输出如下：