title: Getting Error: Can't bind to 'ngModel' since it isn't a known property of 'input' despite importing FormsModule
body: <p>I have imported FormsModule in my app.module.ts  but I am still getting this error. </p>
  
  <blockquote>
    <p>Can't bind to 'ngModel' since it isn't a known property of 'input' </p>
  </blockquote>
  
  <p>I have gone through similar posts but still I am unable to find a solution for this.</p>
  
  <p>app.module.ts</p>
  
  <pre><code> import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import {FormsModule} from '@angular/forms';
  import { AppComponent } from './app.component';
  
  @NgModule({
    declarations: [
      AppComponent
    ],
    imports: [
      BrowserModule
    ],
    providers: [],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>app.component.ts</p>
  
  <pre><code>import { Component } from '@angular/core';
  import {FormsModule} from '@angular/forms';
  import {NgModule  } from "@angular/core";
  import { BrowserModule } from '@angular/platform-browser';
  
  @NgModule({
    imports: [BrowserModule, FormsModule],
    declarations: [ 
      AppComponent
    ],
    bootstrap: [AppComponent]
    })
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
  
  
  })
  export class AppComponent {
  }
  </code></pre>
  
  <p>app.component.html</p>
  
  <pre><code>&lt;input type=radio name="gender" value="Mr" [(ngModel)]="gender"&gt;Male
  &lt;input type=radio name="gender" value="Mrs" [(ngModel)]="gender"&gt;Female
  {{"Hello " + gender}}
  </code></pre>