'Error: Export of name 'ngModel' not found

After building my angular project i get the error: Error: Export of name 'ngModel' not found!

I have my UI running in a docker container

not even sure where to look for this. Its working fine in dev. (ng serve)

Any ideas

angular ngmodel

Solution 1:^[1]

import FormsModule in your respective spec.ts file and app.module.ts if not

beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports:[RouterTestingModule,HttpClientTestingModule,FormsModule],
      declarations: [ MyComponent ]
    })
    .compileComponents();
  }));

Solution 2:^[2]

I had the same error (though in dev), it turns out that I had not added the FormsModule module to the app.module.ts file. See below:

It is also stated here along with a few more problems and their corresponding solutions

Solution 3:^[3]

You need to import FormsModule in your .spec.ts and app.module.ts (if necessary) file, as per below:

import { FormsModule } from '@angular/forms';    <------ Add this code

describe('Testing Component', () => {
  ...
  ...

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ 
            FormsModule      <------ Add this code
        ]
    })
    .compileComponents();
  }));

  ...
  ...

Solution 4:^[4]

Another possible issue: if you're using template form validation When you set #name="ngModel" on a form field without [(ngModel)] directive

E.g.

<input required [value]="hero.name" (change)="setHeroName($event)" #name="ngModel" >

<div *ngIf="name.invalid && (name.dirty || name.touched)"
  class="alert alert-danger">Error</div>

=> Error: Export of name 'ngModel' not found

Fixed by replacing

[value]="hero.name" (change)="setHeroName($event)"

[(ngModel)]="hero.name"

Solution 5:^[5]

I had a template variable called ngModel. Not sure what affect this had, but removing seemed to fix it.

Solution 6:^[6]

I know the question is pretty old, but i had the same problem and want to help people who maybe have the same issue.

So my mistake was, that i forgot to add the ngModel to the input as attribute like so:

Before:

<input type="text" name="email" required email #emailCtrl="ngModel"></input>

After:

<input type="text" ngModel name="email" required email #emailCtrl="ngModel"></input>

Solution 7:^[7]

If you have a form and an element within this form, the element should export a control to the parent using ngModel.

<form (ngSubmit)= "onSubmit()" #f="ngForm">
     <input type="email" id="email" name="email" #email="ngModel">

In the above code the input element is not exporting control to the parent form element. The correct code would be:

<form (ngSubmit)= "onSubmit()" #f="ngForm">
     <input type="email" id="email" name="email" #email="ngModel">

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Ram A K
Solution 2	Joseph Waweru
Solution 3	Jerry Chong
Solution 4	Benjamin Caure
Solution 5	izeko
Solution 6	Max Gusenbauer
Solution 7	Robert

'Error: Export of name 'ngModel' not found

Solution 1:[1]

Solution 2:[2]

Solution 3:[3]

Solution 4:[4]

Solution 5:[5]

Solution 6:[6]

Solution 7:[7]