Question

<p>Original format: {{ item.expires_at }}</p> # 2019-06-30T23:30:01+00:00

输入元素中的格式化日期变得不可编辑，所以遗憾的是我无法编辑它。有没有办法实现这个目标？

<input type="text" ng-model="item.expires_at | date:'dd/MM/yyyy HH:mm:ss'">

没有前端技能并没有帮助，但就我从一些答案中可以看到，我们可以使用下面的例子。但是，当我使用它时，我在输入中没有数据，因此输入元素只是空的。

参考：Using Pipes within ngModel on INPUT Elements in Angular2-View

<input type="text"
[ngModel]="item.expires_at | date:'dd/MM/yyyy HH:mm:ss'"
(ngModelChange)="item.expires_at=$event" />

我看了Template Syntax但找不到解决方案。

Answer 1

您可以在Controller中使用DatePipe。

我建议你在控制器上添加一个onChange方法。您的组件类看起来像这样：

export class MyComponent {

 ...
 expires_formatted;

 constructor(private datePipe: DatePipe)) {
 }

 onChange(expires_at: string) {
   this.expires_formatted = this.datePipe.transform(expires_at, 'dd/MM/yyyy HH:mm:ss');
 }

 ...

}

然后在模板中使用

<input type="text"
[ngModel]="item.expires_at"
(ngModelChange)="onChange($event)" />

在AngularJS mg模型中使用管道并格式化日期

1 个答案: