8

我在我的 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" />

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

在此处输入图像描述

所以你会注意到转换后的值相差了一天。我可以在此处添加什么以确保在通过日期管道后将正确的转换值打印到屏幕上?

4

3 回答 3

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())

于 2018-01-08T18:42:34.850 回答
0

我认为您应该以角度检查本地时区设置。转换日期时使用管道。

于 2018-01-08T18:11:55.667 回答
0

当您打印日期时,它会显示2019-01-17T00:00:00Z

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

{{ getFormattedDate(originalDate) | date }} 
getFormattedDate(originalDate) {
    return originalDate.toISOString().substring(0, originalDate.toISOString().length - 1);
}
于 2019-05-27T15:32:11.480 回答