Why am I getting 'No directive found with exportAs ngModel' error when using FormsModule and...

This is my code and I get "No directive found with exportAs 'ngModel'." error message. I've tried adding FormsModule and ReactiveFormsModule to my app.module.ts (declarations) but still have this issue.

Version: angular 15.2.9

<form>
<div class="form-group">
<label for="name">Course name</label>
<input ngModel name="name" required minlength="3" #name="ngModel" type="text" id="name" class="form-control">
</div>
<div class="form-group">
<label for="category">Course category</label>
<select name="" id="category" class="form-control">
<option value=""></option>
<option *ngFor="let categoryName of categories" [value]="categoryName.id">{{ categoryName.name }}</option>
</select>
</div>
<div class="checkbox">
<label for="moneyBack">
<input type="checkbox" id="moneyBack">
money back he
</label>
</div>
<button class="btn btn-primary">make</button>
</form>


My component.ts file:
import { Component, Input } from '@angular/core';
import { FormControl, FormGroup } from '@angular/forms';

@Component({
selector: 'app-form',
templateUrl: './form.component.html',
styleUrls: ['./form.component.css']
})
export class FormComponent {
@Input('name') name : any;
categories = [
{ id: 1, name: 'dev'},
{ id: 2, name: 'dev2'},
]
}

Continue reading...