AngularJS number input formatted view
angularjs, angularjs-directive, angularjs-ng-model, html
Solution
As written in the comments, `input type="number"` doesn't support anything but digits, a decimal separator (usually `,` or `.` depending on the locale) and `-` or `e`. You may still enter whatever you want, but the browser will discard any unknown / incorrect character.
This leaves you with 2 options:
- Use `type="text"` and pattern validation like `pattern="[0-9]+([\.,][0-9]+)*"` to limit what the user may enter while automatically formatting the value as you do in your example.
- Put an overlay on top of the input field that renders the numbers how you want and still allows the user to use the custom `type="number"` input controls, like demonstrated here.
The latter solution uses an additional `<label>` tag that contains the current value and is hidden via CSS when you focus the input field.
Problem
I want to use a formatted number input to show thousand seperator dots to user when he types big numbers. Here is the directive code that I used: http://jsfiddle.net/LCZfd/3/ When I use `input type="text"` it works, but when I want to use `input type="number"` it's weirdly cleaning by something when user typing big numbers. What is problem about `input[number]`?