如何在输入中使用angular2 datepipe

时间:2016-06-13 14:01:33

标签: angular

我的服务器有一个日期字符串,如下所示。 :

1992-05-26T18:30:00Z

我正在尝试使用日期管道将其格式化为DD / MM / YYYY格式,并将其绑定到我的输入ngModel。

var userdate:any = new Date(data.draftData.accountHolder.dateOfBirth);
this.setDob = userdate | date:'MM/DD/YYYY';

它给我一个错误:

  

ReferenceError:未定义日期

我的HTML如下

<md-input placeholder="Date of birth" value="mm/dd/yy" [(ngModel)]="setDob"></md-input>

有人能指出我在这里失踪的东西。

3 个答案:

答案 0 :(得分:4)

管道应该在模板中使用,而不是在代码中使用。

<div>{{userdate | date:'MM/DD/YYYY'}}</div>

您也可以在代码中使用它,例如

var userdate:any = new Date(data.draftData.accountHolder.dateOfBirth);
var datePipe = new DatePipe();
this.setDob = datePipe.transform(userdate, 'MM/DD/YYYY');

答案 1 :(得分:0)

您可以像这样使用“分隔数据绑定”来代替“双向数据绑定”。

通常情况下,我们使用[(ngModel)]="setDob",但是在这种情况下不能使用管道。 “分离的数据绑定”将帮助我们使用管道,例如:

<input [ngModel]="setDob | somePipeMethod" (ngModelChange)="setDob=$event" />

答案 2 :(得分:-1)

let datepipe = new DatePipe('en-US');
let date = new Date(data.draftData.accountHolder.dateOfBirth);
let formattedDate = this.datepipe.transform(date,"MM/dd/y HH:MM");