AngularJS - Bind input to value with filter and update it

Question

I have an input bound to an object property and with a filter applied to it.

<input value="{{object.field | filter}}">

The problem is that if I programmatically change object.field, the value displayed inside the input doesn't change, however in the DOM Inspector I see the correct (new) value. I verified to digest/apply the changes to the scope and the object.field variable does change correctly, the issue seems to be only in the input displayed value.

I cannot provide an example since there's too much code involved.

Does anyone know where I should look for errors??

brief code that will make sure to understand what the problem is. — Bhojendra Rauniyar, Jun 15 '15 at 08:38
I think I solved it. The input had a wrong event attached to it that was preventing the value to correctly update. The "value" attribute was changing but the $(input).val() wasn't. Consider the problem solved, thank you. — Luca De Nardi, Jun 15 '15 at 08:48

score 0 · Answer 1 · edited May 23 '17 at 12:30

0

No need to set value in that way. ng-model takes care of it. Valid syntax is:

<input ng-model="object.field">

For filtering you can look at this answer: Using angularjs filter in input element

edited May 23 '17 at 12:30

Community

1
1

answered Jun 15 '15 at 08:49

TreeNode

472
1
7
10

Correct me if I'm wrong but unfortunately ng-model can't be used with filters. – Luca De Nardi Jun 15 '15 at 09:09
Ye, you right. But you can use $parsers in your controller to filter value. Look at "Using angularjs filter in input element" link in my answer. Good luck! – TreeNode Jun 15 '15 at 09:17

score 0 · Answer 2 · answered Jun 15 '15 at 08:54

0

I think you should use ng-model to bind your data into input box instead {{expression}}

answered Jun 15 '15 at 08:54

ng-model doesn't support filters, does it? – Luca De Nardi Jun 15 '15 at 09:09
Yes, it doesn't support filter, just bind the data. – Jun 15 '15 at 09:12
To bind it I have to use value="{{xx}}"...Anyway I solved it, an event was preventing the edits, read the question comments for a more detailed info. Thank you anyways :) – Luca De Nardi Jun 15 '15 at 09:15

AngularJS - Bind input to value with filter and update it

2 Answers2