AngularJS and AngularUI: mask or format a phone number when binding

lito picture lito · Nov 19, 2013 · Viewed 60.1k times · Source

I am using AngularUI to format or "masking" a phone number input, and it works fine with a ng-model:

<input ng-model="emer.phone" ui-mask="{{'(999) 999-9999'}}" type="text"/>

Question: But now how can I apply the same mask in the same way using ng-bind, I have something like this:

<td>{{emer.phone}}</td>

My problem: The ng-model and ng-bind are in two different files in different locations, therefor the use of "$viewValue" is not an option for me

Any idea?

some documentation about AngularUI mask: http://angular-ui.github.io/ui-utils/

Thanks!

Answer

Tom Tavernier picture Tom Tavernier · Jul 29, 2014

You should use ui-mask="(999) 999-9999" instead of ui-mask="{{'(999) 999-9999'}}".

The latter tries to bind to a model with '(999) 999-9999' on it.