ngModel data binding not working

Question

I\'m following the Tour of Heroes tutorial and cannot figure out why ngModel is not updating hero.name or if it\'s just not updating the view. I type into the input but the

Answer 1

([ngModel]) should be [(ngModel)]. It's called the bananas-in-a-box-notation ;) (https://www.bennadel.com/blog/3008-two-way-data-binding-is-just-a-box-of-bananas-in-angular-2-beta-1.htm)

Answer 2

Open AppModule (app.module.ts) and import the FormsModule symbol from the @angular/forms library.

import { FormsModule } from '@angular/forms'; // <-- NgModel lives here

Then add FormsModule to the @NgModule metadata's imports array, which contains a list of external modules that the app needs.

imports: [
  BrowserModule,
  FormsModule
],

When the browser refreshes, the app should work again. You can edit the hero's name and see the changes reflected immediately in the above the textbox.

---

source: angular doc.