angular-phone-helper v1.1.2

188 countries + International format (Angular 17)

User's phone's format for pipe

{{ '31234567890' | phoneFormat }} <!-- +3 123 456 7890 -->
{{ '1234567890' | phoneFormat: { iso: 'USA', prefix: true } }} // <!-- +1 (123) 456-7890 -->
{{ '41234567890' | phoneFormat: { prefix: true } }} // <!-- +4 123 456 7890 -->
{{ '1234567890' | phoneFormat: { prefix: true, code: '+33', format: '(XXX) XXX-XXXX' } }} // <!-- +33 (123) 456-7890 -->
{{ '1234567890' | phoneFormat: { prefix: false, code: '+33', format: '(XXX) XXX-XXXX' } }} // <!-- (123) 456-7890 -->
{{ '1234567890' | phoneFormat: { prefix: false, format: '(XXX) XXX-XXXX' } }} // <!-- (123) 456-7890 -->

Setting up in module's imports

import {AngularPhoneHelperModule} from "angular-phone-helper";

// default country config
AngularPhoneHelperModule.forRoot({
  defaultCountryIsoCode: 'USA', // Country ISO code
  defaultWithCountryCode: false, // Add prefix by default
})

// custom country config
AngularPhoneHelperModule.forRoot({
  defaultWithCountryCode: true,
  customCountry: {
    isoCode: 'YOUR_CODE_3_LEN',
    isoCodeAlpha2: 'YOUR_CODE_2_LEN',
    name: 'YOUR_COUNTRY_NAME',
    phone: {
      codeDigit: '10',
      code: '+10',
      format: 'XXX XXX-XX-XX',
      formatInternational: 'XXX XXX-XX-XX',
    }
  }
}),

NOTE: Config is optional

NOTE: For custom country
Some countries have different format 
For example: France
codeDigit: "33", code: "+33", formatInternational: "X XX XX XX XX", format: "0X XX XX XX XX"
X - digits
0 - const

ApiConfig

CountryModel

PhoneModel

Usage PhoneFormatService in ts

import {PhoneFormatService} from "angular-phone-helper";

constructor(private readonly phoneFormatService: PhoneFormatService) {
  this.phoneFormatService.isCustomFormatted('123 456-78-90'); // true
  this.phoneFormatService.isInternationalFormatted('+3 123 456 7890'); // true
  this.phoneFormatService.isInternationalFormatted('+4811231234567890'); // false
  this.phoneFormatService.isInternationalFormatted('+481 2312 67890'); // false
  this.phoneFormatService.isUnitedStatesFormatted('(123) 456-7890'); // true
  this.phoneFormatService.isUnitedStatesFormatted('+1 (123) 456-7890'); // true
  this.phoneFormatService.isUnitedStatesFormatted('+2 (123) 456-7890'); // false
}

Usage PhoneFormatPipe in ts

import {countriesDictionary, PhoneFormatPipe} from "angular-phone-helper";

constructor(private readonly phoneFormatPipe: PhoneFormatPipe) {
  this.phoneFormatPipe.transform('31234567890'); // +3 123 456 7890
  this.phoneFormatPipe.transform('1234567890', { iso: 'USA', prefix: true }); // +1 (123) 456-7890
  this.phoneFormatPipe.transform('1234567890', { prefix: true }); // 1234567890 (wrong length)
  this.phoneFormatPipe.transform('1234567890', { iso: countriesDictionary.usa.isoCode }); // +1 (123) 456-7890
  this.phoneFormatPipe.transform('1234567890', { iso: countriesDictionary.usa.isoCode, prefix: false }) // (123) 456-7890
}

Usage PhoneFormatPipe in html

{{ '31234567890' | phoneFormat }} <!-- +3 123 456 7890 -->
{{ '1234567890' | phoneFormat: { iso: 'USA', prefix: true } }} // <!-- +1 (123) 456-7890 -->
{{ '41234567890' | phoneFormat: { prefix: true } }} // <!-- +4 123 456 7890 -->
{{ '1234567890' | phoneFormat: { prefix: true, code: '+33', format: '(XXX) XXX-XXXX' } }} // <!-- +33 (123) 456-7890 -->
{{ '1234567890' | phoneFormat: { prefix: false, code: '+33', format: '(XXX) XXX-XXXX' } }} // <!-- (123) 456-7890 -->
{{ '1234567890' | phoneFormat: { prefix: false, format: '(XXX) XXX-XXXX' } }} // <!-- (123) 456-7890 -->

Supported countries (in progress...)

NOTE: Methods in table and `custom country method`
Input >>> phone: string
Output >>> result: boolean

NOTE: isFormatted method
Input >>> phone: string, countryIsoCode: string
Output >>> result: boolean

Examples