在具有双向绑定的输入上使用Angular的日期管道 [英] Using Angular's Date Pipe on Input with 2-Way Binding

问题描述

我知道如何将Angular的日期管道与典型的字符串插值示例和/或for循环一起使用.但是，我遇到的情况不同于这两种情况-我在Angular 2应用程序中创建了一种自定义双向绑定.

I am aware of how to use Angular's date pipe with typical string interpolation examples and/or for loops. However, I have a situation that's different than both these scenarios - where I've created a kind of custom two-way binding in my Angular 2 app.

这是我的模板代码的样子:

This is what my template code looks like:

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

有没有办法在这里传递日期管道?我试过像这样传递它:

Is there a way I can pass the date pipe in here? I've tried passing it in like this:

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

...但这不起作用.它不会引发错误，只是不会修改日期格式.我还尝试将整个表达式放在方括号中-并通过错误将其包裹起来.

... but that doesn't work. It doesn't throw an error, it just doesn't modify the date formatting. I also tried wrapping the whole expression in brackets - and that through an error.

是否可以在视图中传递日期管道，还是需要以其他方式进行处理-例如作为组件功能的一部分?在这里寻找最简单的解决方案.

Is there a way I can pass the date pipe here in the view, or do I need to handle this differently - for instance as part of a function in my component? Looking for the simplest solution here.

推荐答案

使用插值而不是绑定的一种方法:

One way to use the interpolated value instead of the binding:

<input class="app-input [(inputModel)]="staff.profile.hireDate" placeholder="None" 
    field-status="{{getPropertyStatus('profile.hireDate') | date}}" />

这篇关于在具有双向绑定的输入上使用Angular的日期管道的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！