Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

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 2 months 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 (about 6 years ago)
Default Branch: master
Last Pushed: 2024-05-12T17:07:24.000Z (7 months ago)
Last Synced: 2024-05-13T17:50:49.950Z (7 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 <code>  7713⭐</code> <code>  1952🍴</code> [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 <code>  7577⭐</code> <code>  1938🍴</code> [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

    

     

```