Skip to content

Instantly share code, notes, and snippets.

@manunoly
Forked from mhartington/mask.ts
Created April 4, 2019 19:38
Show Gist options
  • Select an option

  • Save manunoly/030e05d7d2a65971be76cf9c71a8dbd6 to your computer and use it in GitHub Desktop.

Select an option

Save manunoly/030e05d7d2a65971be76cf9c71a8dbd6 to your computer and use it in GitHub Desktop.

Revisions

  1. @mhartington mhartington created this gist May 24, 2016.
    67 changes: 67 additions & 0 deletions mask.ts
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,67 @@
    import {Directive, Attribute} from '@angular/core';
    import {NgModel} from '@angular/common';
    @Directive({
    selector: '[mask]',
    host: {
    '(keyup)': 'onInputChange()'
    }
    })
    export class Mask {
    maskPattern: string;
    placeHolderCounts: number;
    dividers: string[];
    modelValue: string;
    viewValue: string;

    constructor(
    public model: NgModel,
    @Attribute("mask") maskPattern: string
    ) {
    this.dividers = maskPattern.replace(/\*/g, "").split("");
    this.dividers.push(" ");
    this.generatePattern(maskPattern);
    }

    onInputChange() {
    this.modelValue = this.getModelValue();
    var stringToFormat = this.modelValue;
    if (stringToFormat.length < 10) {
    stringToFormat = this.padString(stringToFormat);
    }

    this.viewValue = this.format(stringToFormat);
    this.model.viewToModelUpdate(this.modelValue);
    this.model.valueAccessor.writeValue(this.viewValue)
    }

    generatePattern(patternString) {
    this.placeHolderCounts = (patternString.match(/\*/g) || []).length;
    for (let i = 0; i < this.placeHolderCounts; i++) {
    patternString = patternString.replace('*', "{" + i + "}");
    }
    this.maskPattern = patternString;
    }

    format(s) {
    var formattedString = this.maskPattern;
    for (let i = 0; i < this.placeHolderCounts; i++) {
    formattedString = formattedString.replace("{" + i + "}", s.charAt(i));
    }
    return formattedString;
    }

    padString(s) {
    var pad = " ";
    return (s + pad).substring(0, pad.length);
    }

    getModelValue() {
    var modelValue = this.model.value;
    for (var i = 0; i < this.dividers.length; i++) {
    while (modelValue.indexOf(this.dividers[i]) > -1) {
    modelValue = modelValue.replace(this.dividers[i], "");
    }
    }
    return modelValue;
    }
    }