Using filter inside ng-model

Question

I'm using the following filter inside a h3:

{{ event.date | date:'dd-MM-yyyy' }}

And is working just fine, the angular is formatting and showing the date like I want. I'm trying to apply the same filter inside an ng-model:

ng-model="event.date | date:'dd-MM-yyyy'"

And this is not working, is throwing an error:

Error: ngModel:nonassign
Non-Assignable Expression
Expression 'event.date' is non-assignable. Element: {1}

Could you someone explain me why?

Thanks!

http://stackoverflow.com/questions/14419651/filters-on-ng-model-in-an-input — Matt Way, Aug 21 '15 at 02:20

atinder · Accepted Answer · 2015-08-21T04:31:10.063

1

That is not possible the way you are trying to do.

An alternate solution will be using input masking. There are some libraries available already for the task such as ngMask and angular-input-masks.

edited Aug 21 '15 at 04:31

answered Aug 21 '15 at 02:38

atinder

score 0 · Answer 2 · answered Aug 21 '15 at 02:34

From the documentation:

The ngModel directive binds an input,select, textarea (or custom form control) to a property on the scope

ng-model needs a variable that it can 2-way data-bind to but the filters output is not assignable.

2 Answers2