mat-currency-format
Version:
This repos is creating a library for angular currency input and also it is showing how to use the library
150 lines • 12.3 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 {?} */
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;
}
export 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;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0LWN1cnJlbmN5LWZvcm1hdC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9tYXQtY3VycmVuY3ktZm9ybWF0LyIsInNvdXJjZXMiOlsibGliL21hdC1jdXJyZW5jeS1mb3JtYXQuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQWlCLEtBQUssRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN4SCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7Ozs7Ozs7QUFNL0MsTUFBTSxVQUFVLG1CQUFtQixDQUFDLEdBQUcsRUFBRSxNQUFNOztVQUN2QyxLQUFLLEdBQUcsSUFBSSxJQUFJLENBQUMsWUFBWSxDQUFDLE1BQU0sQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxPQUFPLENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FBQzs7VUFDcEUsT0FBTyxHQUFHLElBQUksSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLENBQUMsQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxFQUFFLENBQUM7O1FBQ3ZFLG1CQUFtQixHQUFHLEdBQUcsQ0FBQyxPQUFPLENBQUMsSUFBSSxNQUFNLENBQUMsSUFBSSxHQUFHLEtBQUssRUFBRSxHQUFHLENBQUMsRUFBRSxFQUFFLENBQUM7SUFDeEUsbUJBQW1CLEdBQUcsbUJBQW1CLENBQUMsT0FBTyxDQUFDLElBQUksTUFBTSxDQUFDLElBQUksR0FBRyxPQUFPLEVBQUUsR0FBRyxDQUFDLEVBQUUsR0FBRyxDQUFDLENBQUM7O1VBQ2xGLFdBQVcsR0FBRyxtQkFBbUIsQ0FBQyxPQUFPLENBQUMsVUFBVSxFQUFFLEVBQUUsQ0FBQztJQUMvRCxPQUFPLE1BQU0sQ0FBQyxLQUFLLENBQUMsV0FBVyxDQUFDLENBQUMs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Q0FBQyxLQUFLLEdBQUcsTUFBTSxDQUFDO0lBQ3ZDLENBQUM7OztZQWxERixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLDBCQUEwQjtnQkFDcEMsU0FBUyxFQUFFLENBQUMsWUFBWSxDQUFDO2FBQzFCOzs7O1lBbEJtQixVQUFVO1lBQ3JCLFlBQVk7WUFEK0MsU0FBUzt5Q0F5QmpDLE1BQU0sU0FBQyxTQUFTOzs7MkJBSnpELEtBQUs7NEJBQ0wsS0FBSztzQkFnQkwsWUFBWSxTQUFDLE9BQU87eUJBS3BCLFlBQVksU0FBQyxVQUFVO3dCQVF2QixZQUFZLFNBQUMsU0FBUyxFQUFFLENBQUUsUUFBUSxDQUFFO3FCQVdwQyxZQUFZLFNBQUMsTUFBTTs7OztJQXpDcEIsa0RBQThCOztJQUM5QixtREFBK0I7Ozs7O0lBSy9CLDJDQUdFOzs7OztJQUVGLGlEQUErRjs7Ozs7SUFSbkYsd0NBQXNCOzs7OztJQUFFLGtEQUFrQzs7Ozs7SUFDMUQsOENBQTJCOzs7OztJQUFFLDRDQUF5QyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSG9zdExpc3RlbmVyLCBBZnRlclZpZXdJbml0LCBJbnB1dCwgUmVuZGVyZXIyLCBJbmplY3QsIExPQ0FMRV9JRCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ3VycmVuY3lQaXBlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcblxuXG4vKipcbiAqIFRoZSBmdW5jdGlvbiB0byByZXZlcnNlIHRoZSBudW1iZXIgZm9ybWF0XG4gKi9cbmV4cG9ydCBmdW5jdGlvbiByZXZlcnNlRm9ybWF0TnVtYmVyKHZhbCwgbG9jYWxlKSB7XG4gIGNvbnN0IGdyb3VwID0gbmV3IEludGwuTnVtYmVyRm9ybWF0KGxvY2FsZSkuZm9ybWF0KDExMTEpLnJlcGxhY2UoLzEvZywgJycpO1xuICBjb25zdCBkZWNpbWFsID0gbmV3IEludGwuTnVtYmVyRm9ybWF0KGxvY2FsZSkuZm9ybWF0KDEuMSkucmVwbGFjZSgvMS9nLCAnJyk7XG4gIGxldCByZXZlcnNlZEN1cnJlbmN5VmFsID0gdmFsLnJlcGxhY2UobmV3IFJlZ0V4cCgnXFxcXCcgKyBncm91cCwgJ2cnKSwgJycpO1xuICByZXZlcnNlZEN1cnJlbmN5VmFsID0gcmV2ZXJzZWRDdXJyZW5jeVZhbC5yZXBsYWNlKG5ldyBSZWdFeHAoJ1xcXFwnICsgZGVjaW1hbCwgJ2cnKSwgJy4nKTtcbiAgY29uc3QgcmV2ZXJzZWRWYWwgPSByZXZlcnNlZEN1cnJlbmN5VmFsLnJlcGxhY2UoL1teXFxkLi1dL2csICcnKTtcbiAgcmV0dXJuIE51bWJlci5pc05hTihyZXZlcnNlZFZhbCkgPyAwIDogcmV2ZXJzZWRWYWw7XG59XG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbbXZuZHJNYXRDdXJyZW5jeUZvcm1hdF0nLFxuICBwcm92aWRlcnM6IFtDdXJyZW5jeVBpcGVdXG59KVxuZXhwb3J0IGNsYXNzIE1hdEN1cnJlbmN5Rm9ybWF0RGlyZWN0aXZlICBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuXG4gIEBJbnB1dCgpIGN1cnJlbmN5Q29kZSA9ICdVU0QnO1xuICBASW5wdXQoKSBhbGxvd05lZ2F0aXZlID0gZmFsc2U7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZiwgcHJpdmF0ZSBjdXJyZW5jeVBpcGU6IEN1cnJlbmN5UGlwZSxcbiAgICAgICAgICAgICAgcHJpdmF0ZSByZW5kZXJlcjogUmVuZGVyZXIyLCBASW5qZWN0KExPQ0FMRV9JRCkgcHJpdmF0ZSBsb2NhbGU6IHN0cmluZykgeyB9XG5cbiAgcHJpdmF0ZSByZWdleCA9IHtcbiAgICBwb3NpdGl2ZURlY2ltYWw6IG5ldyBSZWdFeHAoL15cXGQqW1xcLnwsXT9cXGQqJC9nKSxcbiAgICBhbGxEZWNpbWFsOiBuZXcgUmVnRXhwKC9eLT9cXGQqW1xcLnwsXT9cXGQqJC9nKVxuICB9O1xuXG4gIHByaXZhdGUgc3BlY2lhbEtleXM6IEFycmF5PHN0cmluZz4gPSBbJ0JhY2tzcGFjZScsICdEZWxldGUnLCAnQXJyb3dMZWZ0JywgJ0Fycm93UmlnaHQnLCAnRGVsJ107XG5cbiAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZSA9IHRoaXMuY3VycmVuY3lQaXBlLnRyYW5zZm9ybSh0aGlzLmVsLm5hdGl2ZUVsZW1lbnQudmFsdWUsIHRoaXMuY3VycmVuY3lDb2RlKTtcbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ2ZvY3VzJykgb25Gb2N1cygpIHtcbiAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQudmFsdWUgPSB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQudmFsdWUucmVwbGFjZSgvW15cXGQuLC1dL2csICcnKTtcbiAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc2VsZWN0KCk7XG4gIH1cblxuICBASG9zdExpc3RlbmVyKCdmb2N1c291dCcpIG9uRm9jdXNvdXQoKSB7XG4gICAgbGV0IHZhbCA9IHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZTtcbiAgICBpZiAodmFsLmxlbmd0aCA9PT0gMCB8fCAodmFsLmxlbmd0aCA9PT0gMSAmJiBbJywnLCAnLicsICcnXS5pbmRleE9mKHZhbFswXSkgPiAtMSkpIHtcbiAgICAgIHZhbCA9ICcwJztcbiAgICB9XG4gICAgdGhpcy5lbC5uYXRpdmVFbGVtZW50LnZhbHVlID0gdGhpcy5jdXJyZW5jeVBpcGUudHJhbnNmb3JtKHZhbCwgdGhpcy5jdXJyZW5jeUNvZGUpO1xuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcigna2V5ZG93bicsIFsgJyRldmVudCcgXSlcbiAgICBvbktleURvd24oZXZlbnQ6IEtleWJvYXJkRXZlbnQpIHtcbiAgICAgIGlmICh0aGlzLnNwZWNpYWxLZXlzLmluZGV4T2YoZXZlbnQua2V5KSAhPT0gLTEpIHtcbiAgICAgICAgcmV0dXJuO1xuICAgICAgfVxuICAgICAgY29uc3QgbWF0Y2hlcyA9IHRoaXMuYWxsb3dOZWdhdGl2ZSA/IGV2ZW50LmtleS5tYXRjaCh0aGlzLnJlZ2V4LmFsbERlY2ltYWwpIDogZXZlbnQua2V5Lm1hdGNoKHRoaXMucmVnZXgucG9zaXRpdmVEZWNpbWFsKTtcbiAgICAgIGlmICghbWF0Y2hlcykge1xuICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgICAgfVxuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignYmx1cicpIG9uQmx1cigkZXZlbnQpIHtcbiAgICBjb25zdCBhbW91bnQgPSByZXZlcnNlRm9ybWF0TnVtYmVyKHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZSwgdGhpcy5sb2NhbGUpLnJlcGxhY2UoL15bXjAtOV17Mn0uLiovZywgJycpO1xuICAgIHRoaXMuZWwubmF0aXZlRWxlbWVudC52YWx1ZSA9IGFtb3VudDtcbiAgfVxuXG59XG4iXX0=