How auto format input number with currency mask (Ionic)

Question

I need to create a currency mask (right to left) in a input=number of my mobile app (Ionic + Cordova). If the user enter with 123456 value, the input should be 1.234,56 (adding "," and "." automatically).

I don't know how to do this with HTML and Javascript.

Anybody help me?

Noting that input type should be "number", to show only numeric keyboard in device.

Sorry my poor english

Solution 1

look at this angular modules and directives:

http://aguirrel.github.io/ng-currency/

jsfiddle.net/odiseo/dj6mX/

http://assisrafael.github.io/angular-input-masks/

Solution 2

Look at this plugin for jQuery jquery-numberformatter:

$(this).parseNumber({format:"#,###.00", locale:"us"});

Solution 3

I know your pain, I've seen a couple of solutions:

• Option A: Build custom directive to hide the real box, and put a fake one on top. Just built a proof of concept demo: http://play.ionic.io/app/e3547f0f6b05

• Option B: Build your own numpad like basically MobiScroll (some paid library) does: http://demo.mobiscroll.com/numpad/currency/ (works ok with angular and ionic) Update: also check this demo: http://demo.mobiscroll.com/numpad/variablefraction/