Package Exports

ngx-intl-phone-number
ngx-intl-phone-number/bundles/ngx-intl-phone-number.umd.js
ngx-intl-phone-number/fesm2015/ngx-intl-phone-number.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (ngx-intl-phone-number) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Intro

This library is for International Phone Number Validation for Angular using Directive. Based on that project. It supports both Template driven and Reactive Forms.

libphonenumber-js is used for the Phone Number validation.

Demo

Usage

npm i ngx-intl-phone-number

Add NgxIntlPhoneNumberModule import to your NgModule like this:

import { NgxIntlPhoneNumberModule } from "ngx-intl-phone-number";

@NgModule({
  imports: [NgxIntlPhoneNumberModule],
})
export class AuthModule {}

Add the Directive to you Phone Number Input like this:

<input
 type="tel"
 formControlName="phoneNumber"
 intl-phone-number
 defaultCountry="PL"
 (countrySelected)="countryChanged($event)"/>

Inputs

Name	Type	Default	Description
searchable	boolean	true	Allow to search for country
searchPlaceHolder	string?	null	The Placeholder for the search input
defaultCountry	string?	null	Alpha 2 Country Code
onlyCountries	string[]?	[]	List of manually selected countries, which will appear in the dropdown
separateDialCode	boolean	false	Use to display dial code next to the flag
strictValidation	boolean	false	If true, it also validates the actual phone number digits

Outputs

Name	Parameters	Description
countrySelected	country: Country	Emits whenever there is a change in country selected including the default country
dropdownOpened	didOpen: boolean	Emits whenever dropdown is toggled

Styling

dropdown-open class is added on the root element of country select when dropdown is open for custom styling

Sources

The Countries Data was copied form this Github Repo