Using Angular's Date Pipe on Input with 2-Way Binding

问题

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.

回答1:

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}}" />

来源：https://stackoverflow.com/questions/46984554/using-angulars-date-pipe-on-input-with-2-way-binding