Home > database >  Angular 10 (change) not detected on form inputfield
Angular 10 (change) not detected on form inputfield

Time:12-04

When I use the (change) to detect inputfield changes it only shows me changes when the user leaves the inputfield. this is the html code :

<input type="text"  (change)="check('test')"   formControlName="title"  [ngClass]="!rForm.controls['title'].valid && rForm.controls['title'].touched ? 'red-border-class' : 'black-border-class'">

What am I doing wrong I want to detect a change immediately not after the user goes to the next inputfield.

Someone who can help?

Thx

CodePudding user response:

I guess you want to use the (keypress)- or (keyup)-Event.

CodePudding user response:

Use Keyup instead of Change may be it would suit your requirement

<input type="text"  (keyup)="check('test')"   formControlName="title" 
      [ngClass]="!rForm.controls['title'].valid && rForm.controls['title'].touched ? 'red-border-class' : 'black-border-class'">

CodePudding user response:

You can use (blur) event, it will call once you leave the inputfield

<input (blur)='check('test')'/>

CodePudding user response:

You have, at least, two ways of doing this.

Use keyup event

Better description about keyup

<input (keyup)="check('test')">

valueChanges of FormControl

https://angular.io/api/forms/AbstractControl#valueChanges

rForm.controls['title'].valueChanges.subscribe(() => {
  check('test');
});
  • Related