I am trying to bind ngModel from text input but it's is not working.
Here is my code:
Template:
<form (ngSubmit)="onSubmit()">
<div class="form-group">
<input type="text" class="form-control" [(ngModel)]="message">
</div>
<input type="submit">
</form>
Component:
export class Component implements OnInit {
message:string
onSubmit() {
console.log(this.message);
}
}
Always getting undefined value. How to bind value from the text input to variable?
you have to give input a name property when using template-driven form.
<input type="text" name="message" [(ngModel)]="message">
refer this simple plunker demo.
You are missing ngForm
<form #f="ngForm" (ngSubmit)="onSubmit(f)">
<div class="form-group">
<input type="text" class="form-control" name="message" [(ngModel)]="message">
</div>
<input type="button">
</form>
export class Component implements OnInit {
message:string
ngOnInit() {
this.message = "test";
}
onSubmit(form: ngForm) {
console.log(form.value);
}
}
