https://github.com/amarkes/br-mask
https://github.com/amarkes/br-mask
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/amarkes/br-mask
- Owner: amarkes
- License: mit
- Created: 2018-09-07T00:22:46.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-06-09T21:15:05.000Z (over 2 years ago)
- Last Synced: 2025-10-06T04:29:55.029Z (5 months ago)
- Language: TypeScript
- Size: 38.1 KB
- Stars: 117
- Watchers: 8
- Forks: 54
- Open Issues: 28
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-ionic - Masks
README
### deprecated
- I no longer have the maintenance for this project, in case anyone wants to take over just contact me
# brmasker-ionic
[](https://github.com/amarkes/br-mask/issues)
[](https://github.com/amarkes/br-mask/stargazers)
[](https://github.com/amarkes/br-mask/network)
[](https://raw.githubusercontent.com/amarkes/br-mask/master/LICENSE)
[](https://travis-ci.org/amarkes/br-mask)
return custom mask in input for ionic 4
# Required
- Node: 10.7.0
- npm 6.4.0
- ionic 4.1.2
- Angular CLI: 6.1.2
# install
```sh
npm install br-mask --save -E
```
# Usage
```javascript
import { BrMaskerModule } from 'br-mask';
@NgModule({
imports: [
BrMaskerModule
],
})
```
### HTML
```html
```
### Other Examples
```html
```
### Example for CPF/CNPJ 999.999.999-99 / 99.999.999/9999-99
```html
```
### Example for Real 999,99
```html
```
### Example for Money
```html
```
### Example for Real 99,999 With Decimal
```html
```
### Example for Real 99,999 With Decimal
```html
```
### Example for Phone (99) 9999-9999 / (99) 99999-9999
```html
```
### Example for Phone not ddd 9999-9999 / 99999-9999
```html
```
### Example for number thousand
```html
```
# Features
```js
import { BrMaskDirective, BrMaskModel } from 'br-mask';
...
constructor(public brMask: BrMaskDirective) {}
...
protected createForm(): FormGroup {
return new FormGroup({
phone: new FormControl(this.createPhone())
});
}
private createPhone(): string {
const config: BrMaskModel = new BrMaskModel();
config.phone = true;
return this.brMask.writeCreateValue('99999999999', config);
}
```
# Inputs
* brmasker: BrMaskModel
```ts
BrMaskModel = {
form: AbstractControl;
mask: string;
len: number;
money: boolean;
phone: boolean;
phoneNotDDD: boolean;
person: boolean;
percent:boolean;
type: 'alfa' | 'num' | 'all';
decimal: number = 2;
decimalCaracter: string = `,`;
thousand: string;
userCaracters = false;
numberAndTousand: false,
moneyInitHasInt: true
}
```
| Name | type | info |
| ------ | ------ | ------ |
| form | FormControl | Obsolete |
| mask | string | Optional |
| len | string | Optional |
| money | boolean | Optional |
| phone | boolean | Optional |
| phoneNotDDD | boolean | Optional |
| person | boolean | Optional |
| percent | boolean | Optional |
| type | string | Optional default 'all' |
| decimalCaracter | string | Optional default ',' |
| decimal | number | Optional default '2' |
| thousand | string | Optional |
| userCaracters | boolean | Optional default `false` |
| numberAndTousand | boolean | Optional default `false` |
| moneyInitHasInt | boolean | Optional default `true` |
`moneyInitHasInt is when you need to use cents in value`
# Characters
`- . / ( ) , * + @ # $ & % :`
# Build for developer
### Only use if you change the component
### Build
```sh
npm run build
```
### Publish
```sh
npm publish
```
# Changelog
### 0.0.9
- pull issues
### 0.0.8
- change phone mask for accept 11 digits
### 0.0.7
- removing the need to declare the form
### 0.0.6
- remove console log
### 0.0.5
- add prop moneyInitHasInt
# Changelog
### 0.0.4
- add phoneNotDDD
### 0.0.3
- fix numberAndTousand
### v0.0.2
- add number thousand
### v0.0.1
- Inicial project