0

我正在尝试改变某些日期在我的 Angular 2 应用程序中的显示方式。就我而言,在视图中使用日期管道和字符串插值不是一种选择,因为我的模板代码如下所示:

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

一位评论者建议我在将其传递给视图之前尝试处理组件中日期的转换。这是他写的:

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

从“@angular/common”导入 { DatePipe };然后将其添加到组件或 ngModule 中的 providers 数组中。

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

constructor(private myDatePipe: DatePipe) {} 并修改您的变量属性:

this.staff.profile.hireDate = this.myDatePipe.transform(新日期(this.staff.profile.hireDate));

这听起来像是完美的解决方案。但是,我仍然不清楚确切的实施。我已经导入DatePipe并在构造函数中定义了一个本地实例。但是下一部分在哪里:

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

我尝试将它放在构造函数的主体中,但不行。

所以我仍然有点不清楚这是怎么回事,以及之后是否还需要更改视图中的代码。

任何清晰度将不胜感激。

4

1 回答 1

0

那样使用 DatePipe

NgModule({
  providers: [DatePipe]
})

并在您的组件内部:

import { DatePipe } from '@angular/common';
...
constructor(private datePipe: DatePipe) {}
...
this.staff.profile.hireDate= this.datePipe.transform(this.staff.profile.hireDate, 'dd-MM-yy');
于 2017-11-09T23:51:41.473 回答