Model driven form validation issue in Angular 2.0

2
votes

In Angular 2.0, model driven form using Form Builder, I have,

 ngOnInit() {
    this.user = this.fb.group({
        id: ['', [Validators.required, Validators.minLength(2)]],
        name: ['', [Validators.required, Validators.minLength(5)]]
    });
    
    this.user.get('id').valueChanges.subscribe(value => {
                alert("Change detected); 
                });
}

and in HTML I have :

<input   type="text" formControlName="id" >

But what happening is for every letter I change in text box the alert("Change detected"); is getting fired, instead after tabout only I need to call alert("Change detected"). I know in Angular 1.x to achieve this by using ng-model-options but how to achieve the same in Angular 2.0?

1
angularangular2-formsangular-validation
where you write this subscription? - sainu
in ngOnInit(). Edited the question - Madasu K

1 Answers

1
votes

You can bind to onblur handler

<input type="text" formControlName="id" (blur)="onBlur()">

and in class 

onBlur(){
  alert("Change detected");  
}