@msafi/angular2-text-mask

Angular 2 directive for input text masking

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
8,028299Jun 12, 2021Jan 22, 2016Minified + gzip package size for @msafi/angular2-text-mask in KB

Readme

Angular 2 Input Mask

Getting started

First, install it.

npm i @msafi/angular2-text-mask --save

Then, require it and use it:

import 'es6-shim';
import 'es6-promise';
import 'zone.js/dist/zone';
import 'reflect-metadata';

import {bootstrap} from 'angular2/platform/browser'
import {Component} from 'angular2/core';
import MaskedInput from '@msafi/angular2-text-mask'

@Component({
  selector: 'app',
  templateUrl: `
    <input [textMask]="{mask: '(111) 111 1111'}" [(ngModel)]="myModel" type="text"/>
  `,
  directives: [MaskedInput]
})
export class AppComponent {
  private myModel = ''
}

bootstrap(AppComponent);

Example

TypeScript

You can see a working example in this folder.

Plain JavaScript

For a plain JavaScript example, you can check out this Plunk.

Documentation

As you can see in the example above, you are passing an object to the textMask directive.

For more information about the values that the textMask object accepts, see the documentation here.

License

Public domain - CC0 1.0 Universal

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.