onBlur - View does not reflect model

[Mike]

Hi Angular Team,

I'm trying to round a field to two decimal places when the user leaves the input field. However if you change the field from 3.25 to say 3.252 the model correctly updates to 3.25 but the field continues to show 3.252.  The view only seems to update if the actual model changes to a new value (ie. entering 3.258 rounds to 3.26 which is then updated in the view)

Could someone help with a solution?

JS Fiddle : http://jsfiddle.net/dTQQC/1/

Thanks,

Mike

[Josh Kurz]

Hey so I started doing it with the directive then I got to thinking that it might be a little to much for this. So I just created a filter that does what your looking for. 

http://jsfiddle.net/dTQQC/4/

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
 
 

--
Josh Kurz

Head of Web Development

SEO
Social Media 
Digital Photography 
Internet Marketing

cell#      404-641-7807
office#    404-593-0851
fax#       404-506-9642
Dillinger Media 
http://dillingermediaonline.com

[Mike]

Thanks, but that's not quite what I'm looking for.  I want the input text field to show the rounded value after the user finishes entering text in the field. Can filters be applied to a text field?

I've solved it by wrapping the rounding in a $timeout(). It works, but I'm not sure why the timeout is required, perhaps something to do with the directive setViewValue. If anyone can offer an improved solution I would be happy to hear it.  

http://jsfiddle.net/dTQQC/10/

[tda...@gmail.com]

I realize this post is over a month old, but I was interested in this problem and this is the solution I came up with (without the $timeout hack):

http://jsfiddle.net/dTQQC/14/

I'm not sure how technically correct it is (you could argue it's a different hack), but I think the model should always be updated with the most specific value (i.e. 3.25444) in order to generate a "dirty" event.  This way, you could define a $render function on the controller that's tied to the ngModelOnblur directive (which should be called "round" or something) and then call that function from the blur event.  

Basically, during the blur event, coerce the input to re-render itself with the rounded value, keeping the model value intact.