CODEWITHSUNDEEP
angularinputdata-bindingngmodel
AlreadyLost
AlreadyLost

Reputation: 827

angular2 two-way binding doesn't updated as I enter the string

I am new to angular2 and I am hoping someone can help me with a basic thing that why my two way binding is not working. I have this super simple code in my html and I have added following in my module.ts:

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule} from '@angular/forms';

in html:
<input [(ngModel)]="username">
<p>Hello {{username}}!</p>

The problem that I have is that as I enter a string in the input box the "Hello {{username}}" doesn't get updated. But when I just click outside of the input box the "Hello {{username}}" will be updated with the entered value.

Please let me know what magic I am missing here :(. thanks

Upvotes: 1

Views: 2255

Answers (2)

Asif Uddin
Asif Uddin

Reputation: 36

I faced the same issue. For me the solution was using "string" as datatype rather then "String".

Upvotes: 0

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657078

I think you need to add ngModelOptions or name

<input [(ngModel)]="username" [ngModelOptions]="{standalone: true}">

or

<input [(ngModel)]="username" name="username">

Upvotes: 1

Related Questions