mat-currency-format/fesm2015/mat-currency-format.js

This repos is creating a library for angular currency input and also it is showing how to use the library

import { Directive, ElementRef, Renderer2, Inject, LOCALE_ID, Input, HostListener, NgModule } from '@angular/core';
import { CurrencyPipe } from '@angular/common';

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * The function to reverse the number format
 * @param {?} val
 * @param {?} locale
 * @return {?}
 */
function reverseFormatNumber(val, locale) {
    /** @type {?} */
    const group = new Intl.NumberFormat(locale).format(1111).replace(/1/g, '');
    /** @type {?} */
    const decimal = new Intl.NumberFormat(locale).format(1.1).replace(/1/g, '');
    /** @type {?} */
    let reversedCurrencyVal = val.replace(new RegExp('\\' + group, 'g'), '');
    reversedCurrencyVal = reversedCurrencyVal.replace(new RegExp('\\' + decimal, 'g'), '.');
    /** @type {?} */
    const reversedVal = reversedCurrencyVal.replace(/[^\d.-]/g, '');
    return Number.isNaN(reversedVal) ? 0 : reversedVal;
}
class MatCurrencyFormatDirective {
    /**
     * @param {?} el
     * @param {?} currencyPipe
     * @param {?} renderer
     * @param {?} locale
     */
    constructor(el, currencyPipe, renderer, locale) {
        this.el = el;
        this.currencyPipe = currencyPipe;
        this.renderer = renderer;
        this.locale = locale;
        this.currencyCode = 'USD';
        this.allowNegative = false;
        this.regex = {
            positiveDecimal: new RegExp(/^\d*[\.|,]?\d*$/g),
            allDecimal: new RegExp(/^-?\d*[\.|,]?\d*$/g)
        };
        this.specialKeys = ['Backspace', 'Delete', 'ArrowLeft', 'ArrowRight', 'Del'];
    }
    /**
     * @return {?}
     */
    ngAfterViewInit() {
        this.el.nativeElement.value = this.currencyPipe.transform(this.el.nativeElement.value, this.currencyCode);
    }
    /**
     * @return {?}
     */
    onFocus() {
        this.el.nativeElement.value = this.el.nativeElement.value.replace(/[^\d.,-]/g, '');
        this.el.nativeElement.select();
    }
    /**
     * @return {?}
     */
    onFocusout() {
        /** @type {?} */
        let val = this.el.nativeElement.value;
        if (val.length === 0 || (val.length === 1 && [',', '.', ''].indexOf(val[0]) > -1)) {
            val = '0';
        }
        this.el.nativeElement.value = this.currencyPipe.transform(val, this.currencyCode);
    }
    /**
     * @param {?} event
     * @return {?}
     */
    onKeyDown(event) {
        if (this.specialKeys.indexOf(event.key) !== -1) {
            return;
        }
        /** @type {?} */
        const matches = this.allowNegative ? event.key.match(this.regex.allDecimal) : event.key.match(this.regex.positiveDecimal);
        if (!matches) {
            event.preventDefault();
        }
    }
    /**
     * @param {?} $event
     * @return {?}
     */
    onBlur($event) {
        /** @type {?} */
        const amount = reverseFormatNumber(this.el.nativeElement.value, this.locale).replace(/^[^0-9]{2}..*/g, '');
        this.el.nativeElement.value = amount;
    }
}
MatCurrencyFormatDirective.decorators = [
    { type: Directive, args: [{
                selector: '[mvndrMatCurrencyFormat]',
                providers: [CurrencyPipe]
            },] }
];
/** @nocollapse */
MatCurrencyFormatDirective.ctorParameters = () => [
    { type: ElementRef },
    { type: CurrencyPipe },
    { type: Renderer2 },
    { type: String, decorators: [{ type: Inject, args: [LOCALE_ID,] }] }
];
MatCurrencyFormatDirective.propDecorators = {
    currencyCode: [{ type: Input }],
    allowNegative: [{ type: Input }],
    onFocus: [{ type: HostListener, args: ['focus',] }],
    onFocusout: [{ type: HostListener, args: ['focusout',] }],
    onKeyDown: [{ type: HostListener, args: ['keydown', ['$event'],] }],
    onBlur: [{ type: HostListener, args: ['blur',] }]
};
if (false) {
    /** @type {?} */
    MatCurrencyFormatDirective.prototype.currencyCode;
    /** @type {?} */
    MatCurrencyFormatDirective.prototype.allowNegative;
    /**
     * @type {?}
     * @private
     */
    MatCurrencyFormatDirective.prototype.regex;
    /**
     * @type {?}
     * @private
     */
    MatCurrencyFormatDirective.prototype.specialKeys;
    /**
     * @type {?}
     * @private
     */
    MatCurrencyFormatDirective.prototype.el;
    /**
     * @type {?}
     * @private
     */
    MatCurrencyFormatDirective.prototype.currencyPipe;
    /**
     * @type {?}
     * @private
     */
    MatCurrencyFormatDirective.prototype.renderer;
    /**
     * @type {?}
     * @private
     */
    MatCurrencyFormatDirective.prototype.locale;
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class MatCurrencyFormatModule {
}
MatCurrencyFormatModule.decorators = [
    { type: NgModule, args: [{
                declarations: [MatCurrencyFormatDirective],
                imports: [],
                exports: [MatCurrencyFormatDirective]
            },] }
];

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

export { MatCurrencyFormatDirective, MatCurrencyFormatModule, reverseFormatNumber };
//# sourceMappingURL=mat-currency-format.js.map