Ngx-international-number NPM

Intro

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

libphonenumber-js is used for the Phone Number validation.

Demo

Usage

npm i ngx-international-number

Add InternationalPhoneModule import to your NgModule (where the directive is used) like this:

import { NgxInternationalNumberModule } from "ngx-international-number";

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

Add the Directive to you Phone Number Input like this:

<input
 type="tel"
 formControlName="phoneNumber"
 international-number
 defaultCountry="PK"
 (countrySelected)="countryChanged($event)"/>

Inputs

Name	Type	Default	Description
searchPlaceHolder	string?	null	The Placeholder for the search input
defaultCountry	string?	null	Alpha 2 Country Code
hue	string?	212	HSL color Hue value for customizing theme
customScrollbar	boolean?	true	Use false to disable theming for scrollbar

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