AngularJS provides the number and currency filters to automatically format numbers with comma thousands separators. But these filters don’t work when you want to format a number within an input text box.

Ideally you will want to show the comma thousands separators to start with, and remove them when the input box gains focus. I couldn’t find any directive that already did this, so I created the fcsa-number directive to provide this functionality. I also added a few validations that can be applied to it as well.

Here’s a few examples of what the directive does and the validations it provides:

If you want to use it on your site, just follow the installation instructions in the Readme file on the project’s Github site.