This library formats American national numbers and international numbers using Angular, Googles i18n Phone Number Formatter.
NOTE: This was made for a specific project, so is not very configurable.
- AngularJS
- Lodash
- National numbers are American numbers. They will be decorated as (###) ###-####.
- X's are not stripped from national numbers as they could be the precursor for extensions. Other letters are.
- X's are stripped from international extensions (a company decision)
- If a national number has more than 10 digits, it will format the first 10 digits and append the rest, seperated by a space.
- Eg: 1234567890x123 becomes (123) 456-7890 x123
- International numbers will begin with a "+" to differentiate them from national numbers
Add the module as a dependency
angular.module( "app", [
"phoneNumberFormatter"
] );
Add "phone-number" as an attribute and the value as ng-model
<input type="text" ng-model="myPhoneNumber" phone-number></input>
Use "phone-number" as an attribute or element. Add the value as ng-model. If you're using it as an attribute, be aware that it creates an isolate scope, so you cannot use another attribute that creates an isolate scope on the same element
<phone-number ng-model="myPhoneNumber"></phone-number>
or
<p phone-number ng-model="myPhoneNumber"></p>
<p>{{myPhoneNumber|phoneNumber}}</p>
or
$scope.myPhoneNumber = $filter('phoneNumber')($scope.myPhoneNumber);
Inject PhoneNumberFormatter
as a dependency.
var myNum = 1234567890,
numberFormatter = new PhoneNumberFormatter();
var formattedNumber = numberFormatter.getFormattedNumber(myNum); //(123) 456-7890
var isInternational = numberFormatter.isInternational(myNum); //false
var unformattedNumber = numberFormatter.trim(myNum); //1234567890
- Download app
- cd into "demo"
- Run "npm install"
- Run "bower install"
- Run "grunt serve"