AngularJS date 过滤器



  • 定义和用法

    date 过滤器将日期格式化为指定的格式。
    日期可以是日期对象,毫秒或日期时间字符串,例如 "2019-11-05T09:05:05.035Z"
    默认情况下,格式为 "MMM d, y"(2019年11月5日)。
  • 语法

    {{ date | date : format : timezone }}
  • 参数

    参数 必需的 描述
    format
    用于显示日期的日期格式,可以是以下一项或多项:
    • "yyyy"年(2019年)
    • "yy" 年(19)
    • "y" 年(2019年)
    • "MMMM" 月(一月)
    • "MMM" 月(1月)
    • "MM" 月(01)
    • "M" 月(1)
    • "dd" 日(06)
    • "d" 日(6)
    • "EEEE" 日(星期二)
    • "EEE" 日(星期二)
    • "HH" 小时,00-23(09)
    • "H" 小时 0-23(9)
    • 00/12, 在"上午/下午 "h" 小时(09)"
    • 0/12, 上午/下午,"h" 小时(9)
    • "mm" 分钟(05)
    • "m" 分钟(5)
    • "ss" 秒(05)
    • "s" 秒(5)
    • "sss" 毫秒(035)
    • "a"(上午/下午)
    • "Z" 时区(从-1200到+1200)
    • "ww" 周(00-53)
    • "w" 周(0-53)
    • "G" 时代(公元)
    • "GG" 时代(公元)
    • "GGG" 时代(公元)
    • "GGGG" 时代(Anno Domini)
    格式值也可以是以下预定义格式之一:
    • "short" 与 "M/d/yy h:mm a" 相同(19年11月5日上午9:05)
    • "medium" 与 "MMM d, y h:mm:ss a" 相同(2019年11月5日,上午9:05:05)
    • "shortDate" 与 "M/d/yy" 相同 (11/5/19)
    • "mediumDate" 与 "MMM d, y" 相同 (2019年11月5日)
    • "longDate" 与 "MMMM d, y" 相同 (2019年11月5日)
    • "fullDate" 与 "EEEE, MMMM d, y" 相同(2019年11月5日,星期二)
    • "shortTime" 与 "h:mm a" 相同 (上午9:05)
    • "mediumTime" 与 "h:mm:ss a" 相同 (上午9:05:05)
    timezone 用于格式化日期的时区。
  • 示例

    下例演示了以自定义格式显示日期:
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>欢迎来到蝴蝶教程</title>
    <script src="//cdn.bootcss.com/angular.js/1.5.8/angular.min.js"></script>
    </head>
    <body>
        <div ng-app="myApp" ng-controller="datCtrl">
            <p>Date = {{ today | date : "fullDate" }}</p>
        </div> 
        <script>
            var app = angular.module('myApp', []);
            app.controller('datCtrl', function($scope) {
                $scope.today = new Date();
            });
        </script>
         <p>显示日期时可以使用预定义的格式</p>
    </body>
    </html>