mat-currency-format
Version:
This repos is creating a library for angular currency input and also it is showing how to use the library
163 lines • 13 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Directive, ElementRef, HostListener, Input, Renderer2, Inject, LOCALE_ID } from '@angular/core';
import { CurrencyPipe } from '@angular/common';
/**
* The function to reverse the number format
* @param {?} val
* @param {?} locale
* @return {?}
*/
export function reverseFormatNumber(val, locale) {
/** @type {?} */
var group = new Intl.NumberFormat(locale).format(1111).replace(/1/g, '');
/** @type {?} */
var decimal = new Intl.NumberFormat(locale).format(1.1).replace(/1/g, '');
/** @type {?} */
var reversedCurrencyVal = val.replace(new RegExp('\\' + group, 'g'), '');
reversedCurrencyVal = reversedCurrencyVal.replace(new RegExp('\\' + decimal, 'g'), '.');
/** @type {?} */
var reversedVal = reversedCurrencyVal.replace(/[^\d.-]/g, '');
return Number.isNaN(reversedVal) ? 0 : reversedVal;
}
var MatCurrencyFormatDirective = /** @class */ (function () {
function MatCurrencyFormatDirective(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 {?}
*/
MatCurrencyFormatDirective.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
this.el.nativeElement.value = this.currencyPipe.transform(this.el.nativeElement.value, this.currencyCode);
};
/**
* @return {?}
*/
MatCurrencyFormatDirective.prototype.onFocus = /**
* @return {?}
*/
function () {
this.el.nativeElement.value = this.el.nativeElement.value.replace(/[^\d.,-]/g, '');
this.el.nativeElement.select();
};
/**
* @return {?}
*/
MatCurrencyFormatDirective.prototype.onFocusout = /**
* @return {?}
*/
function () {
/** @type {?} */
var 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 {?}
*/
MatCurrencyFormatDirective.prototype.onKeyDown = /**
* @param {?} event
* @return {?}
*/
function (event) {
if (this.specialKeys.indexOf(event.key) !== -1) {
return;
}
/** @type {?} */
var matches = this.allowNegative ? event.key.match(this.regex.allDecimal) : event.key.match(this.regex.positiveDecimal);
if (!matches) {
event.preventDefault();
}
};
/**
* @param {?} $event
* @return {?}
*/
MatCurrencyFormatDirective.prototype.onBlur = /**
* @param {?} $event
* @return {?}
*/
function ($event) {
/** @type {?} */
var 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 = function () { return [
{ 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',] }]
};
return MatCurrencyFormatDirective;
}());
export { MatCurrencyFormatDirective };
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;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0LWN1cnJlbmN5LWZvcm1hdC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9tYXQtY3VycmVuY3ktZm9ybWF0LyIsInNvdXJjZXMiOlsibGliL21hdC1jdXJyZW5jeS1mb3JtYXQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQWlCLEtBQUssRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN4SCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7Ozs7Ozs7QUFNL0MsTUFBTSxVQUFVLG1CQUFtQixDQUFDLEdBQUcsRUFBRSxNQUFNOztRQUN2QyxLQUFLLEdBQUcsSUFBSSxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FBQzs7UUFDcEUsT0FBTyxHQUFHLElBQUksSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLENBQUMsQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxFQUFFLENBQUM7O1FBQ3ZFLG1CQUFtQixHQUFHLEdBQUcsQ0FBQyxPQUFPLENBQUMsSUFBSSxNQUFNLENBQUMsSUFBSSxHQUFHLEtBQUssRUFBRSxHQUFHLENBQUMsRUFBRSxFQUFFLENBQUM7SUFDeEUsbUJBQW1CLEdBQUcsbUJBQW1CLENBQUMsT0FBTyxDQUFDLElBQUksTUFBTSxDQUFDLElBQUksR0FBRyxPQUFPLEVBQUUsR0FBRyxDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7O1FBQ2xGLFdBQVcsR0FBRyxtQkFBbUIsQ0FBQyxPQUFPLENBQUMsVUFBVSxFQUFFLEVBQUUsQ0FBQztJQUMvRCxPQUFPLE1BQU0sQ0FBQyxLQUFLLENBQUMsV0FBVyxDQUFDLENBQUMs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LENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQyxLQUFLLEdBQUcsTUFBTSxDQUFDO0lBQ3ZDLENBQUM7O2dCQWxERixTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLDBCQUEwQjtvQkFDcEMsU0FBUyxFQUFFLENBQUMsWUFBWSxDQUFDO2lCQUMxQjs7OztnQkFsQm1CLFVBQVU7Z0JBQ3JCLFlBQVk7Z0JBRCtDLFNBQVM7NkNBeUJqQyxNQUFNLFNBQUMsU0FBUzs7OytCQUp6RCxLQUFLO2dDQUNMLEtBQUs7MEJBZ0JMLFlBQVksU0FBQyxPQUFPOzZCQUtwQixZQUFZLFNBQUMsVUFBVTs0QkFRdkIsWUFBWSxTQUFDLFNBQVMsRUFBRSxDQUFFLFFBQVEsQ0FBRTt5QkFXcEMsWUFBWSxTQUFDLE1BQU07O0lBS3RCLGlDQUFDO0NBQUEsQUFwREQsSUFvREM7U0FoRFksMEJBQTBCOzs7SUFFckMsa0RBQThCOztJQUM5QixtREFBK0I7Ozs7O0lBSy9CLDJDQUdFOzs7OztJQUVGLGlEQUErRjs7Ozs7SUFSbkYsd0NBQXNCOzs7OztJQUFFLGtEQUFrQzs7Ozs7SUFDMUQsOENBQTJCOzs7OztJQUFFLDRDQUF5QyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBBZnRlclZpZXdJbml0LCBJbnB1dCwgUmVuZGVyZXIyLCBJbmplY3QsIExPQ0FMRV9JRCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ3VycmVuY3lQaXBlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcblxuXG4vKipcbiAqIFRoZSBmdW5jdGlvbiB0byByZXZlcnNlIHRoZSBudW1iZXIgZm9ybWF0XG4gKi9cbmV4cG9ydCBmdW5jdGlvbiByZXZlcnNlRm9ybWF0TnVtYmVyKHZhbCwgbG9jYWxlKSB7XG4gIGNvbnN0IGdyb3VwID0gbmV3IEludGwuTnVtYmVyRm9ybWF0KGxvY2FsZSkuZm9ybWF0KDExMTEpLnJlcGxhY2UoLzEvZywgJycpO1xuICBjb25zdCBkZWNpbWFsID0gbmV3IEludGwuTnVtYmVyRm9ybWF0KGxvY2FsZSkuZm9ybWF0KDEuMSkucmVwbGFjZSgvMS9nLCAnJyk7XG4gIGxldCByZXZlcnNlZEN1cnJlbmN5VmFsID0gdmFsLnJlcGxhY2UobmV3IFJlZ0V4cCgnXFxcXCcgKyBncm91cCwgJ2cnKSwgJycpO1xuICByZXZlcnNlZEN1cnJlbmN5VmFsID0gcmV2ZXJzZWRDdXJyZW5jeVZhbC5yZXBsYWNlKG5ldyBSZWdFeHAoJ1xcXFwnICsgZGVjaW1hbCwgJ2cnKSwgJy4nKTtcbiAgY29uc3QgcmV2ZXJzZWRWYWwgPSByZXZlcnNlZEN1cnJlbmN5VmFsLnJlcGxhY2UoL1teXFxkLi1dL2csICcnKTtcbiAgcmV0dXJuIE51bWJlci5pc05hTihyZXZlcnNlZFZhbCkgPyAwIDogcmV2ZXJzZWRWYWw7XG59XG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbbXZuZHJNYXRDdXJyZW5jeUZvcm1hdF0nLFxuICBwcm92aWRlcnM6IFtDdXJyZW5jeVBpcGVdXG59KVxuZXhwb3J0IGNsYXNzIE1hdEN1cnJlbmN5Rm9ybWF0RGlyZWN0aXZlICBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuXG4gIEBJbnB1dCgpIGN1cnJlbmN5Q29kZSA9ICdVU0QnO1xuICBASW5wdXQoKSBhbGxvd05lZ2F0aXZlID0gZmFsc2U7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZiwgcHJpdmF0ZSBjdXJyZW5jeVBpcGU6IEN1cnJlbmN5UGlwZSxcbiAgICAgICAgICAgICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLCBASW5qZWN0KExPQ0FMRV9JRCkgcHJpdmF0ZSBsb2NhbGU6IHN0cmluZykgeyB9XG5cbiAgcHJpdmF0ZSByZWdleCA9IHtcbiAgICBwb3NpdGl2ZURlY2ltYWw6IG5ldyBSZWdFeHAoL15cXGQqW1xcLnwsXT9cXGQqJC9nKSxcbiAgICBhbGxEZWNpbWFsOiBuZXcgUmVnRXhwKC9eLT9cXGQqW1xcLnwsXT9cXGQqJC9nKVxuICB9O1xuXG4gIHByaXZhdGUgc3BlY2lhbEtleXM6IEFycmF5PHN0cmluZz4gPSBbJ0JhY2tzcGFjZScsICdEZWxldGUnLCAnQXJyb3dMZWZ0JywgJ0Fycm93UmlnaHQnLCAnRGVsJ107XG5cbiAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZSA9IHRoaXMuY3VycmVuY3lQaXBlLnRyYW5zZm9ybSh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQudmFsdWUsIHRoaXMuY3VycmVuY3lDb2RlKTtcbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ2ZvY3VzJykgb25Gb2N1cygpIHtcbiAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQudmFsdWUgPSB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQudmFsdWUucmVwbGFjZSgvW15cXGQuLC1dL2csICcnKTtcbiAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2VsZWN0KCk7XG4gIH1cblxuICBASG9zdExpc3RlbmVyKCdmb2N1c291dCcpIG9uRm9jdXNvdXQoKSB7XG4gICAgbGV0IHZhbCA9IHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZTtcbiAgICBpZiAodmFsLmxlbmd0aCA9PT0gMCB8fCAodmFsLmxlbmd0aCA9PT0gMSAmJiBbJywnLCAnLicsICcnXS5pbmRleE9mKHZhbFswXSkgPiAtMSkpIHtcbiAgICAgIHZhbCA9ICcwJztcbiAgICB9XG4gICAgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnZhbHVlID0gdGhpcy5jdXJyZW5jeVBpcGUudHJhbnNmb3JtKHZhbCwgdGhpcy5jdXJyZW5jeUNvZGUpO1xuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcigna2V5ZG93bicsIFsgJyRldmVudCcgXSlcbiAgICBvbktleURvd24oZXZlbnQ6IEtleWJvYXJkRXZlbnQpIHtcbiAgICAgIGlmICh0aGlzLnNwZWNpYWxLZXlzLmluZGV4T2YoZXZlbnQua2V5KSAhPT0gLTEpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgICAgfVxuICAgICAgY29uc3QgbWF0Y2hlcyA9IHRoaXMuYWxsb3dOZWdhdGl2ZSA/IGV2ZW50LmtleS5tYXRjaCh0aGlzLnJlZ2V4LmFsbERlY2ltYWwpIDogZXZlbnQua2V5Lm1hdGNoKHRoaXMucmVnZXgucG9zaXRpdmVEZWNpbWFsKTtcbiAgICAgIGlmICghbWF0Y2hlcykge1xuICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgfVxuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignYmx1cicpIG9uQmx1cigkZXZlbnQpIHtcbiAgICBjb25zdCBhbW91bnQgPSByZXZlcnNlRm9ybWF0TnVtYmVyKHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZSwgdGhpcy5sb2NhbGUpLnJlcGxhY2UoL15bXjAtOV17Mn0uLiovZywgJycpO1xuICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZSA9IGFtb3VudDtcbiAgfVxuXG59XG4iXX0=