showing results for - "accept 2 values after decimal in angular forms"
Florine
12 Sep 2019
1import { Directive, ElementRef, HostListener } from '@angular/core';
2@Directive({
3  selector: '[appTwoDigitDecimaNumber]'
4})
5export class TwoDigitDecimaNumberDirective {
6  private regex: RegExp = new RegExp(/^\d*\.?\d{0,2}$/g);
7  private specialKeys: Array<string> = ['Backspace', 'Tab', 'End', 'Home', '-', 'ArrowLeft', 'ArrowRight', 'Del', 'Delete'];
8  constructor(private el: ElementRef) {
9  }
10  @HostListener('keydown', ['$event'])
11  onKeyDown(event: KeyboardEvent) {
12    console.log(this.el.nativeElement.value);
13    // Allow Backspace, tab, end, and home keys
14    if (this.specialKeys.indexOf(event.key) !== -1) {
15      return;
16    }
17    let current: string = this.el.nativeElement.value;
18    const position = this.el.nativeElement.selectionStart;
19    const next: string = [current.slice(0, position), event.key == 'Decimal' ? '.' : event.key, current.slice(position)].join('');
20    if (next && !String(next).match(this.regex)) {
21      event.preventDefault();
22    }
23  }
24}
Briley
26 Nov 2018
1<input type="textbox" [(ngModel)]="InputValue" appTwoDigitDecimaNumber>
queries leading to this page
how to show only two decimal places in angularallow decimal and numbers in angular input typeangular format input decimalsinput type 3d 22number 22 angular decimal caseshow to round 2 decimal places in angularallow only 2 decimal values in input angularangular round number to 2 decimal placesup to two decimal places angular jsangular 2 decimal places onlyround input number angular htmlinput box with two decimal places angularangular input number with 2 decimal placesdisplay number without decimal angularafter decimal display 1 value angularangular number input with decimalsangular round to 2 decimal placesshow only two decimal places in angularangular input allow decimalsinput allow decimal in angularinput type number no decimalangular input number decimal placesinput accept number 2 decimals angularaccept decimal values input numberangular input number to floatangular number with 2 decimalsangular form number numbers anfd after decimal two value validationangular 2 pipe decimal places without zerodisplay number with two decimals angular inputangular make input 2 decimal placesangular input 2 decimal placeshow to input numbers till two decimal places in angularangular mat input force decimal point insertinput number 2 decimals angularangular display 2 decimal placesregex to accept only numbers and decimals angularshow two decimal places angular jsallow only numbers and decimal in textbox angular 10angular filter decimal 2 placeshow to show number with two 0 after point in angular 8input type number always show two decimalsaccept 2 values after decimal in angular formsonly 2 decimal places angular inputangular 2 pipe decimal placesangular float 2 decimalinput type 3dnumber 2 decimal places in angularangular input number decimal formaterangular 2 decimal value convert integerangular 7b 7b 7d 7d with 2 decimalshow to add decimal digits about user input in angulardisplay number to specific precision in angularangular how to force decimal inputangularjs number with 2 decimalsinput type accept million value with decimal places angular 8angular input type million value with decimal placesangular input value to two decimal places show only 3 decimals angularaccept 2 values after decimal in angular forms