ngModel leaves blank screen when called

Question

I'm trying to learn the basics of Angular2, so I was trying to make some tests. I've already downloaded typescript and angular/cli.

I can use iterpolation, property binding, etc. but when I try to use a two-way data-binding like that(in app.component.html for tests):

<input type="text" [(ngModel)]="test.description">

and the ng server refreshes, all the things that I've done disappear and all I see is a blank screen.

I ask that the answers be simple, because I'm a begginner in using angular.

EDIT: Even after updating app.modules.ts, my console keep displaying the following error:

Uncaught Error: Template parse errors:
Can't bind to 'NgModel' since it isn't a known property of 'input'. ("
</p>

<input type="text" [ERROR ->][(NgModel)]="test.description" >`

Answer 1

You must be getting an error on console, to use ngModel, Add this to your Module,

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
imports: [
         FormsModule      
]

Use the correct syntax ngModel

<input type="text" name="name" [(ngModel)]="test.description">

Answer 2

You need to put a "name" attribute on the input in order to make it work with ngModel

<input type="text" name="name" [(ngModel)]="test.description">

Here is the Plunker

Answer 3

I have found that simply adding formsModule to the imports in the app.module.ts folder (or wherever the module file is) fixes this problem. It's simply trying to implement something in a library currently unaccessible. You also need to add an import statement at the top of the file.

import { FormsModule} from '@angular/forms';



@NgModule(imports: [BrowserModule, FormsModule]})

This resolved my own problems with the ngModule not working.