error NG8003: No directive found with exportAs 'ngModel'

Question


<form>
    <div class="form-group">
        <label for="firstName">First Name</label>
        <input required ngModel name="firstName" #firstName="ngModel" (change)="log(firstName)" id="firstName" class="form-control">
        <div class="alert" *ngIf="!firstName.valid">First Name should not be empty</div>

    </div>
<div class="form-group">
    <label for="comment">Comment</label>
    <textarea id="comment" cols="30" rows="10" class="form-control"></textarea>
</div>
<button class="btn btn-primary">Submit</button>
</form>

Whenever tried to run this component Node says "error NG8003: No directive found with exportAs 'ngModel'."

I was expecting to get rid of this issue and also want to reply how i was able to solve the issue`

Have you imported `FormsModule` into your module? See https://stackoverflow.com/questions/38648407/angular2-error-there-is-no-directive-with-exportas-set-to-ngform — Alex, Feb 20 '23 at 13:58
yes , i have added and wanted to share the same thing with everyone may be that would be helpful — Abhijeet Ranade, Feb 20 '23 at 13:59

score 0 · Answer 1 · answered Feb 20 '23 at 13:58

I was struggling with this issue and wanted to answer this question separately

Ok to solve this issue you need to import FormsModule in your app.modules.ts file as shown below:

@NgModule({
  declarations: [
    AppComponent,
    ContactFormComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

error NG8003: No directive found with exportAs 'ngModel'

1 Answers1