Angular 7 后 3 小时后的日期

Question

我正在使用 Angular 7。我有一个日期选择器。例如，我选择 2019-03-26。但是当我点击 save 按钮时，控制台显示为 2019-03-25T21:00:00.000Z 。 时间倒退 3 小时。这个错误的原因是什么？

STACKBLITZ

我正在使用 primeng 7.0.5。

Answer 1

实际上，这是因为您看到了 Stackblitz 服务器模拟浏览器 console.log window，所以它通过服务器模拟控制台日志以 UTC 时区打印 DateTime。

{birthDate: "2019-03-15T14:56:04.000Z"} //Printin UTC Time

要检查它的正确方法是单击 在新 Window 中打开，然后它将显示正确的日期时间，如下所示。

Here is live window

Answer 2

您处于当地时区，而日期选择器以 UTC 格式返回日期。您可以通过减少与 UTC 日期的时区偏移量来更正它。

由于时区偏移量以分钟为单位，但 Date 对象自 1970 年以来以毫秒计算，因此您需要将偏移量乘以 1000 * 60。

const utcDate = '2019-05-01T00:00:00Z';
const localDate = new Date(new Date(utcDate) - new Date().getTimezoneOffset() * 1000 * 60);

Answer 3

大多数 UI 日历将输入的日期存储为 UTC（协调世界时）日期或时间戳。但是显示给用户的日期是用您当地的时区转换的，这可能与 UTC 不同。

console.log(_Date_) 打印 UTC 时间，如果你想在你当地的时区看到这个时间你可以使用 ate 的方法，比如 getHours().

因此，如果您打印 this.myForm.value.birthDate.getHours()，您将看到正确的当地时间。但是你不应该将存储时间转换为本地时间

Answer 4

这是由于时区偏移造成的。您从表格中得到的是格林威治标准时间的日期，因此，当您尝试在控制台上打印日期时，您会将时间调整为您当地的时区。所以打印的时候需要把日期时间调整到当地时区。

试试这个：

 save() {
    let localDate = new Date( this.myForm.value.birthDate.getTime() + Math.abs(this.myForm.value.birthDate.getTimezoneOffset()*60000) ) 
    console.log(this.myForm.value);
    console.log(localDate);
  }

Answer 5

我找到了解决办法。 Primeng 日历有一个属性 dataType 。 DataType 默认为 date。如果您设置 string 而不是 date，那么它可以正常工作并向服务器发送正确的日期。

StackBlitz

您可以从这个 stackblitz link.

的工作示例中看到

Angular 7 后 3 小时后的日期

Date going 3 hour back in Angular 7

typescript

primeng

angular

angular7