如何在Angular项目中格式化日期字段

时间:2019-05-22 14:46:26

标签: angular typescript

我有一个stringVariable来自后端服务,我已经将其转换为如下所示的Date字段。

date d = new Date(stringVariable );

这很好。但是新的日期输出看起来像这样。

Thu Jun 29 2017 20:00:00 GMT-0400 (Eastern Daylight Time)

我需要将其更改为其他格式yyyy-mm-dd,并且我需要将变量'd'保留为Date而不是String。

如果我使用日期管道转换方法或.toLocaleString,它将把最终输出'd'转换为字符串。那不应该发生的。

专家的帮助。

1 个答案:

答案 0 :(得分:2)

您无法更改Date对象的格式。

但是,为了解决您的问题,您可以在模板/ html上使用日期管道。它在Angular中本地可用。它不会更改d的值,因为它只是将其转换为您所需的yyyy-mm-dd格式。您component.ts上的d的值仍将是Date Object格式,因此您可以继续在组件的其他部分使用它。您可以在here上签出日期管道的可接受格式。

<input [ngModel]="d  | date:'yyyy-MM-dd'"/>

您可以参考此short demo


编辑:由于您使用的是PrimeNg的p-calendar组件,我们可以简单地利用dateFormat属性,其作用与上面的管道相同。

<p-calendar [(ngModel)]="d" dateFormat="yy-MM-dd"></p-calendar>

这里是demo。在我的演示中,我绑定了onSelect事件,以便每次您选择新日期时都会打印更新的d