1 view

Handling form control Events two way binding in Angular

Step 1: user-settings-form.component.html file

<form #form="ngForm" (ngSubmit)="onSubmit(form)">
    <div class="form-group">
        <label for="name">Name</label>
        <input id="name" name="name" class="form-control" [(ngModel)]="userSettings.name" required (blur)="onBlur()" />
    </div>
	<button class="btn btn-primary">Send</button>
</form>

Step 2: user-settings-form.component.ts file

import { NgForm, NgModel } from '@angular/forms';

 onBlur(){
    console.log('Name: ', this.userSettings.name);
}

Leave a Reply