Skip to content

amarkes/brmasker4

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

34 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Lib is deprecated

We're sorry, but we'll focus only on one library

brmasker4

GitHub issues GitHub stars GitHub forks GitHub license Build Status

return custom mask in input for angular 4

Required

  • node v8.4.0 or up
  • npm 5.4.2 or up
  • @angular/cli: 1.4.4

install

npm install brmasker4 --save

HTML

correct usage

<input type="text" name="cpf" placeholder="CPF" [brmasker]="{mask:'000.000.000-00', len:14}" value="">

Module

import { BrMasker4Module } from 'brmasker4';

@NgModule({
  imports: [
    BrMasker4Module
  ],
})

Features

import { BrMaskerDirective, BrMaskModel } from 'brmasker-ionic-3';

...

constructor(public brMaskerDirective: BrMaskerDirective) {}

...

protected createForm(): FormGroup {
  return new FormGroup({
    phone: new FormControl(this.createPhone())
  });
}

private createPhone(): string {
  const config: BrMaskModel = new BrMaskModel();
  config.phone = true;
  return this.brMaskerDirective.writeCreateValue('99999999999', config);
}

Inputs

  • brmasker: BrModel
	BrModel = {
	 mask: string;
	 len: number;
	 money: boolean;
	 phone: boolean;
	 person: boolean;
	}
Name type info
mask string Optional
len string Optional
money boolean Optional
decimal number Optional for 'money', default '2'
phone boolean Optional
person boolean Optional
percent boolean Optional
type string Optional default 'all'

Exemple for CPF/CNPJ 999.999.999-99 / 99.999.999/9999-99

usage

<input type="text" name="cpf" placeholder="CPF/CNPJ" [brmasker]="{person: true}" value="">

Exemple for Real 999,99

usage

<input type="text" name="money" placeholder="(R$) Real" [brmasker]="{money: true}"  value="">

Exemple for Phone (99) 9999-9999 / (99) 99999-9999

usage

<input type="text" name="phone" placeholder="Phone" [brmasker]="{phone: true}"  value="">

Characters

- . / ( ) , * + @ # $ & %

Guide

[brmasker]="{mask:'000.000.000-00', len:14}"

[brmasker] = component receive array (mask, len)

mask --> required / default = '' / custom mask

len --> required / default = 0 / number of length

data

[brmasker]="{mask:'00/00/0000', len:10}"

cep

[brmasker]="{mask:'00.000-000', len:10}"

custom cpf

[brmasker]="{mask:'000.000.000-00', len:14}"

custom cnpj

[brmasker]="{mask:'00.000.000/0000-00', len:18}"

custom telefone

[brmasker]="{mask:'(00) 0000-0000', len:14}"

custom whatsapp

[brmasker]="{mask:'(00) 00000-0000', len:15}"

Build for developer

Only use if you change the component

Build

npm run build

Publish

npm publish

Versions

  • for angular 6 using version 1.0.2

  • for angular 5 using version 1.0.1

Changelog

v1.0.2

  • support for angular 6

  • news updates

v1.0.1

  • fix number in person and phone

v1.0.0

  • Suport reactive form

v0.0.29

  • custom phone, money and person mask