https://github.com/mpalourdio/intl-tel-input-ng

:telephone: Angular module for intl-tel-input integration (https://github.com/jackocnr/intl-tel-input)
https://github.com/mpalourdio/intl-tel-input-ng

angular angular2 e164 intl-tel-input lib-phone-number phone-number

Last synced: about 1 month ago
JSON representation

:telephone: Angular module for intl-tel-input integration (https://github.com/jackocnr/intl-tel-input)

• Host: GitHub
• URL: https://github.com/mpalourdio/intl-tel-input-ng
• Owner: mpalourdio
• License: mit
• Created: 2018-12-10T11:34:54.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2024-05-12T17:07:24.000Z (12 months ago)
• Last Synced: 2024-05-13T17:50:49.950Z (12 months ago)
• Topics: angular, angular2, e164, intl-tel-input, lib-phone-number, phone-number
• Language: TypeScript
• Homepage:
• Size: 3.12 MB
• Stars: 16
• Watchers: 5
• Forks: 6
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

• awesome-angular - intl-tel-input-ng - An Angular component to easily integrate [intl-tel-input](https://github.com/jackocnr/intl-tel-input). (Table of contents / Angular)
• fucking-awesome-angular - intl-tel-input-ng - An Angular component to easily integrate <b><code>&nbsp;&nbsp;7905⭐</code></b> <b><code>&nbsp;&nbsp;1966🍴</code></b> [intl-tel-input](https://github.com/jackocnr/intl-tel-input)). (Table of contents / Angular)
• fucking-awesome-angular - intl-tel-input-ng - An Angular component to easily integrate <b><code>&nbsp;&nbsp;7577⭐</code></b> <b><code>&nbsp;&nbsp;1938🍴</code></b> [intl-tel-input](https://github.com/jackocnr/intl-tel-input)). (Table of contents / Angular)

README

        
# intl-tel-input-ng

[![CI](https://github.com/mpalourdio/ng-http-loader/actions/workflows/main.yml/badge.svg)](https://github.com/mpalourdio/ng-http-loader/actions/workflows/main.yml)

[![Coverage Status](https://coveralls.io/repos/github/mpalourdio/intl-tel-input-ng/badge.svg?branch=master)](https://coveralls.io/github/mpalourdio/intl-tel-input-ng?branch=master)

[![npm](https://img.shields.io/npm/v/intl-tel-input-ng.svg)](https://www.npmjs.com/package/intl-tel-input-ng)

[![npm](https://img.shields.io/npm/dm/intl-tel-input-ng.svg)](https://www.npmjs.com/package/intl-tel-input-ng)

## Changelog

[Please read the changelog](CHANGELOG.md)

## Contributing

Use the fork, Luke. PR without tests will likely not be merged.

## What is it ?

It's an angular standalone component to easily integrate [intl-tel-input](https://github.com/jackocnr/intl-tel-input).

## Installation

To install this library, run:

```bash

# install intl-tel-input

$ npm install intl-tel-input --save / yarn add intl-tel-input

# install this module

$ npm install intl-tel-input-ng --save / yarn add intl-tel-input-ng

```

- Add `node_modules/intl-tel-input/build/js/utils.js` to the `scripts` section in your `angular.json`.  

- Add `node_modules/intl-tel-input/build/css/intlTelInput.css` to the `styles` section in your `angular.json`.

- Import ``IntlTelInputNgModule.forRoot()`` in your main application module.

## Options

 - `options`: An object wrapping the `intl-tel-input` [options](https://github.com/jackocnr/intl-tel-input#options).

 - `label`: If specified, will generate a `label` for the input (if the name option is set too).

 - `name`: Sets `name` and `id` attributes for the input. The default value is `intl-tel-input-name`.

 - `cssClass`: The CSS class used to style the input component.

 - `labelCssClass`: The CSS class used to style the label associated to the input.

 - `required`: Sets the `required` && `aria-required` attributes for the input.

 - `[(E164PhoneNumber)]`: Outputs the phone number in E164 format if valid.

See the [intl-tel-input repository](https://github.com/jackocnr/intl-tel-input) for more documentation.

## Example:

**The component must be declared between `` tags !**

 

 ```xml

    

     

```