Angular 转换原始日期值后日期管道打印错误日期

Question

我在 Angular 2 应用程序中使用 Angular 的日期管道，以便以更人性化的格式设置日期格式。我能够从 API 中提取日期，并成功编辑这些日期并将其保存到 API。但是，我运行遇到了日期管道错误地转换日期的问题 - 就实际显示的内容而言。

澄清一下，如果我将原始日期打印到屏幕上，它是正确的。当我编辑通过日期管道传递的值时，会保存正确的日期。然而，在我进行编辑之后，转换后的日期值再次发生变化（不是根据保存的内容，只是根据视图中显示的内容）——它最终会稍微偏离，通常是一天左右.因此，如果我将值编辑为 09/25/2010，该值将保存到数据库中，但视图中显示的是 09/24/2010。所以看起来可能是关于时区的某种默认设置导致了问题？

这是我的视图代码的样子（我将首先列出通过日期管道传递的日期值，然后列出相同的值，但没有通过日期管道传递）对于 dob - 出生日期：

<!-- DATE PASSED THROUGH DATE PIPE -->
    <input class="app-input" [ngModel]="member.dob | date:'MM/dd/yyyy'"
        (ngModelChange)="member.dob=$event" name="inputField" type="text" /> 

<!-- RAW VALUE PRINTED TO SCREEN -->
    <input class="app-input" [ngModel]="member.dob" 
        (ngModelChange)="member.dob=$event" name="inputField" type="text" />

这是上面代码最终打印到屏幕上的内容：

所以您会注意到转换后的值有一天的偏差。我可以在此处添加什么以确保在通过日期管道传递后将正确的转换值打印到屏幕上？

Answer 1

我认为您应该检查 angular 中的本地时区设置。管道在转换日期时使用它。

Answer 2

问题不在于管道，而是在将其转换为字符串时。这是因为您所在的时区。我使用以下方法获得正确的值：

>d = new Date();
Tue Jan 09 2018 00:08:38 GMT+0530 (India Standard Time)
>d.toISOString()
"2018-01-08T18:38:38.752Z"
>d.setMinutes(d.getMinutes() - d.getTimezoneOffset());
1515456518752
>d
Tue Jan 09 2018 05:38:38 GMT+0530 (India Standard Time)
>d.toISOString()
"2018-01-09T00:08:38.752Z"

将日期转换为 d.setMinutes(d.getMinutes() - d.getTimezoneOffset())

Answer 3

打印日期时显示 2019-01-17T00:00:00Z

Z - 这里表示时区。尝试在执行日期 Pipe 之前避免这种情况。

{{ getFormattedDate(originalDate) | date }} 
getFormattedDate(originalDate) {
    return originalDate.toISOString().substring(0, originalDate.toISOString().length - 1);
}

Angular 转换原始日期值后日期管道打印错误日期

Angular Date Pipe Printing Wrong Date After Transforming Original Date Value

javascript

typescript

date-pipe

angular