/angular-libphonenumber

nathanhammond/libphonenumber as an angular input mask

Primary LanguageJavaScriptOtherNOASSERTION

angular-libphonenumber - AngularJS input masks for phone numbers

Info Badges
Version Bower version NPM version
License Apache license
Testing Build Status Coverage Status
Quality Dependencies status Code Climate

Sauce Test Status

Description

angular-libphonenumber is an angular directive that can be used as an input mask. By default, all numbers are formatted in US format, but the format can be set with the country-code descriptor. It uses nathanhammond/libphonenumber as a formatter for phone number's, which calls Google's libphonenumber to format numbers as you type them.

View a demo here

Installation

Using Bower:

bower install --save angular-libphonenumber

You then must decide what version of libphonenumber you want. There are two included, and you must include one of them in your application before angular-libphonenumber:

  • dist/libphonenumber.js - only includes the libphonenumber code needed for typeahead to work
  • dist/libphonenumber.full.js - includes all libphonenumber functionality including typeahead
<!-- Use either -->
<script src="./<path_to_bower_components>/angular-libphonenumber/dist/libphonenumber.full.js" />
<!-- OR -->
<script src="./<path_to_bower_components>/angular-libphonenumber/dist/libphonenumber.js" />
<!-- THEN -->
<script src="./<path_to_bower_components>/angular-libphonenumber/dist/angular-libphonenumber.min.js" />

Then include it in your angular application:

angular.module('myModule', ['cwill747.phonenumber']);

How to Use

  • You need to get the user's country code from somewhere. Where you do that is up to you (setting, local storage, angular-translate, or just another input box):
<input type="text" ng-model="countrycode" />
  • Then you just apply the input mask to any input box:
<input type="text" ng-model="phoneNumber" phone-number country-code="countrycode" />

Support

If you are having any questions or issues getting things to work, you can:

Project's issue on GitHub should be used discuss bugs and features.

Contributing to the project

We welcome any contributions to the project. Please check the CONTRIBUTING.md for contribution guidelines.

Check out our contributors here

Development

Prepare your environment

  • Install Node.js and NPM (should come with)
  • Install global dev dependencies: npm install -g gulp karma
  • Install local dev dependencies: npm install while current directory is angular-libphonenumber repo

Build

  • Build the whole project: gulp - this will run jshint, test, and build targets

Release

  • Use GitHub's release tool to draft and publish a release. I like the format better than changelogs.