1

我的 Angular 2 应用程序中显示了一个日期,该应用程序以不希望的格式打印,如下所示:2012-04-02T00:00:00.000Z

我想做的是使用 Angular 的日期管道来转换这些数据,以便以更人性化的格式打印。有没有办法可以在我使用双向绑定的输入上使用日期管道?换句话说,我可以在看起来像这样的代码上使用日期管道吗?

<input class="app-input" [(ngModel)]="staff.profile.hireDate" placeholder="None"/>

我已经尝试了各种尝试,但到目前为止一直无法让它发挥作用。因此,我想知道这是否可能。

而且,如果没有,我可以通过纯 JS 处理这个问题的另一种方法是什么?我对任何有效且最容易实施的可能性持开放态度。

4

1 回答 1

1

您可以在您的组件中执行此操作。

import { DatePipe } from '@angular/common';

然后将其添加到providers组件或 ngModule 中的数组中。

在您的组件中,您将其注入构造函数中:

constructor(private myDatePipe: DatePipe) {}

并修改您的变量属性:

this.staff.profile.hireDate = 
    this.myDatePipe.transform(new Date(this.staff.profile.hireDate));

如果要指定输出,例如使用以下'short'选项:

this.staff.profile.hireDate = 
    this.myDatePipe.transform(new Date(this.staff.profile.hireDate), 'short');
于 2017-11-04T12:23:59.747 回答