title: Uncaught Error: Template parse errors: Can't bind to 'ngModel' since it isn't a known property of 'input'
body: <p>I'm using Angular 4.2.4 and I am getting an error in the console :</p>
  
  <pre><code>Uncaught Error: Template parse errors: Can't bind to 'ngModel' since it isn't a known property of 'input'.
  </code></pre>
  
  <p>while I include FormsModule in file app.module.ts like as </p>
  
  <pre><code>import { FormsModule,ReactiveFormsModule }   from '@angular/forms';
  @NgModule({
    declarations: [
      AppComponent,
      ...APP_LAYOUTS,
      ...APP_COMPONENTS,
    ],
    imports: [
      BrowserModule,
      FormsModule,
      HttpModule,
      AppRoutingModule
    ],
    providers: [],
    bootstrap: [AppComponent]
  })
  </code></pre>
  
  <p>and by html code is as</p>
  
  <pre><code>&lt;form id="user-add-form"&gt;
      &lt;div class="text-center m-t-10"&gt;&lt;span class="login-img"&gt;&lt;i class="ti-check-box"&gt;&lt;/i&gt;&lt;/span&gt;&lt;/div&gt;
      &lt;h3 class="login-title"&gt;Add New User&lt;/h3&gt;
      &lt;div class="row"&gt;
        &lt;div class="col-6"&gt;
          &lt;div class="form-group"&gt;
            &lt;input class="form-control" type="text" name="first_name" [(ngModel)]="first_name" placeholder="First Name"&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="col-6"&gt;
          &lt;div class="form-group"&gt;
            &lt;input class="form-control" type="text" name="last_name" [(ngModel)]="last_name" placeholder="Last Name"&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="form-group"&gt;
        &lt;input class="form-control" type="email" name="email" [(ngModel)]="email" placeholder="Email" autocomplete="off"&gt;
      &lt;/div&gt;
      &lt;div class="form-group"&gt;
        &lt;input class="form-control" id="password" type="password" name="password" [(ngModel)]="password" placeholder="Password"&gt;
      &lt;/div&gt;
      &lt;div class="form-group"&gt;
        &lt;input class="form-control" type="password" name="password_confirmation" [(ngModel)]="password_confirmation" placeholder="Confirm Password"&gt;
      &lt;/div&gt;
      &lt;div class="form-group"&gt;
        &lt;button class="btn btn-info btn-block" type="submit"&gt;Submit&lt;/button&gt;
      &lt;/div&gt;
    &lt;/form&gt;
  </code></pre>
  
  <p>and some component file code is </p>
  
  <pre><code>import { FormBuilder,Validator } from '@angular/forms';
  export class UserAddComponent implements OnInit, OnDestroy, AfterViewInit {
      first_name: string;
      last_name: string;
      email: string;
      password: string;
      password_confirmation: string;
  </code></pre>
  
  <p>I already see the below links but not get any solutions</p>
  
  <p><a href="https://stackoverflow.com/questions/43298011/angular-4-cant-bind-to-ngmodel-since-it-isnt-a-known-property-of-input">Angular 4 - &quot;Can&#39;t bind to &#39;ngModel&#39; since it isn&#39;t a known property of &#39;input&#39; &quot; error</a></p>
  
  <p><a href="https://stackoverflow.com/questions/38880150/angular-2-cant-bind-to-ngmodel-since-it-isnt-a-known-property-of-input">Angular 2: Can&#39;t bind to &#39;ngModel&#39; since it isn&#39;t a known property of &#39;input&#39;</a></p>
  
  <p><a href="https://stackoverflow.com/questions/38892771/cant-bind-to-ngmodel-since-it-isnt-a-known-property-of-input">Can&#39;t bind to &#39;ngModel&#39; since it isn&#39;t a known property of &#39;input&#39;</a></p>
  
  <p>please help to resolve it</p>