【问题标题】：Unable to format default MySQL datetime无法格式化默认 MySQL 日期时间
【发布时间】：2014-01-09 16:29:09
【问题描述】：

我的日期从数据库中出来，如下所示：2013-11-21 17:43:20

我正在尝试使用 Angular 的日期过滤器将它们变成更漂亮的东西，但是...

{{Objected.created | date:'shortDate'}}

或

{{Objected.created | date:'YYYY'}}

...只是吐出原始日期时间字符串：2013-11-21 17:43:20。没有错误。我做错了什么？

更新我看到 MySQL 的默认日期时间与 Angular 的数据过滤器所期望的不兼容。我正在尝试像这样即时转换它，但它会抛出错误：

<li ng-repeat="result in data">{{ new Date(result.Job.created).toISOString() | date:'shortDate'}}</li>

我怀疑我无法以我尝试的方式实例化 Date 类。错误是 $parse:syntax 错误。

更新

感谢@m59 的帮助，我做了一些小的调整...

HTML：

<html ng-app="myApp">
...
{{Object.created | dateToISO | date:'shortDate'}}

JS：

var myApp = angular.module('myApp',[]);

myApp.filter('dateToISO', function() {
  return function(input) {
    input = new Date(input).toISOString();
    return input;
  };
});

这个自定义过滤器将默认的 MySQL 日期时间转换为日期过滤器期望的格式，所以我发送它一个接着一个，然后“瞧”。

【问题讨论】：

标签： javascript mysql angularjs datetime

【解决方案1】：

你指定的日期格式错误YYYY应该是yyyy，其他例子看documentation。

此外，您尝试格式化的日期字符串与 Angular 的规范不匹配。

日期格式为日期对象、毫秒（字符串或数字）或各种 ISO 8601 日期时间字符串格式（例如 yyyy-MM-ddTHH:mm:ss.SSSZ 及其较短的版本，如 yyyy-MM-ddTHH:mmZ， yyyy-MM-dd 或 yyyyMMddTHHmmssZ）。如果字符串输入中没有指定时区，则时间被认为是本地时区。

无论您从何处检索原始字符串，我建议您以其中一种格式存储/尝试检索它。

示例JSFiddle 使用正确的格式。

【讨论】：

【解决方案2】：

您需要将日期字符串转换为 Angular 支持的格式，例如 ISO 8601 格式。你可以这样转换：

$scope.Object.created = new Date($scope.Object.created).toISOString();

Live demo here (click).

要即时执行此操作，您需要一个自定义过滤器。 Live demo here (click).

标记：

<div>{{Object.created | dateToISO | date:'shortDate'}}</div>

JavaScript：

app.filter('dateToISO', function() {
  return function(input) {
    return new Date(input).toISOString();
  };
});

更新：

这是手动转换日期的简单方法（firefox）：

app.filter('badDateToISO', function() {
  return function(badTime) {
    var goodTime = badTime.replace(/(.+) (.+)/, "$1T$2Z");
    return goodTime;
  };
});

【讨论】：

是否可以在{{}} 内部即时进行这种转换？我是 Angular 的新手，尝试时它会抛出错误（请参阅上面的更新）。
看起来很棒！我所有的工作都在一个角度控制器内。我还没有在任何地方定义app。我的文档顶部有：<html ng-app>。这会自动定义它吗？
感谢您的帮助！
Firefox 失败...invalid date
我不明白为什么 Angular 不支持 MySQL DATETIME 开箱即用，它是最常用的数据库之一

【解决方案3】：

我为此创建了一个管道，如下所示

import { Pipe } from "@angular/core";

@管道({ 名称：'DateToIso' }) 导出类 DateToIso {

transform(value, args) {

var regex=/^([0-9]{2,4})-([0-1][0-9])-([0-3][0-9]) (?:([0-2][0-9]):([0-5][0-9]):([0-5][0-9]))?$/;

var parts=value.replace(regex,"$1 $2 $3 $4 $5 $6").split(' ');

var converted = new Date(parts[0],parts[1]-1,parts[2],parts[3],parts[4],parts[5]);

let newValue = converted.toISOString();

return newValue;

}

}

【讨论】：

【解决方案4】：

我创建了一个管道

import { Pipe } from "@angular/core";

@管道({ 名称：DateToIso' }) 导出类 DateToIso {

transform(value, args) {

var regex=/^([0-9]{2,4})-([0-1][0-9])-([0-3][0-9]) (?:([0-2][0-9]):([0-5][0-9]):([0-5][0-9]))?$/;

var parts=value.replace(regex,"$1 $2 $3 $4 $5 $6").split(' ');

var converted = new Date(parts[0],parts[1]-1,parts[2],parts[3],parts[4],parts[5]);

let newValue = converted.toISOString();

return newValue;

}

}

然后在模板中使用

{{ p.sessionTimeFinish | DateToIso  |  date: "HH:mm" }}

【讨论】：

【解决方案5】：

Angular 2 管道

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'toIso'
})
export class ToIsoPipe implements PipeTransform {
  transform(value: string): unknown {
    return value.replace(' ', 'T');
  }
}

// INPUT : "2020-08-20 09:00:20"
// OUTPUT : "2020-08-20T09:00:20"

示例

{{response.created | toIso | date:'MMM d, h:mm a'}}

【讨论】：