'Angular 13 forms module related errors with forms module installed

notice:

Error: src/app/money_makers/shochat_guts/shochat_content_creator_components/active-stream-dashboard/shochat-contentcreator-chat/shochat-contentcreator-chat.component.html:81:18 - error NG8002: Can't bind to 'ngModel' since it isn't a known property of 'input'.

81                  [(ngModel)]="forminput"

but look at my app module

import {FormsModule} from '@angular/forms';

    imports: [
    FormsModule,
    ....
    ]

this error only happened when I migrated my angular 10 project to a angular 13 project.

I did this migration by starting a new angular 13 project and then moving over the src folder to the new angular 13 project and then installed all dependencies

why is this happening?

@NgModule({
  declarations: [
    ...
    
    ShochatContentcreatorChatComponent,

    ShochatDisplayToUserComponentComponent,
    ShochatUserChatComponent,
    UserSetChatnameComponent,
    ShochatUserLivevideoComponent,
    ShochatUserShochatsDisplayComponent,
    ShochatUserVideoCallComponent,
    ShochatVideoChatComponent,
    ShochatUserVideoCallActualComponent,
    ShochattimerComponent,
    UserconsomablepreviewComponent,
    CreditcardorloginaddneeedComponent,
    ContentcreatorendshochatreviewComponent,
    UserendshochatreviewComponent,
    UserFavLikesPurchaesesComponent,
    CreatorstatsComponent,
    CreatortypeindexComponent,
    ShochatshowpreviewComponent,
    EmailverifedrefreshuserloginComponent,
    ContentfeedpostsComponent,
    ContentcreatorintrovideodashboardComponent,
    ShochatEncodingHowtoComponent,
    SubscribingplaceholderComponent,
    ContentcreatorcategoriesadminComponent,
    ModeratecreatorpostsadminComponent,
    ContentfeedpostcommentsComponent,
  ],
    imports: [
      CommonModule,
      BrowserModule,
      RouterModule,
      FontAwesomeModule,
      RecaptchaV3Module,
      FormsModule,
      ReactiveFormsModule,
      HttpClientModule,
      AppRoutingModule,


Solution 1:[1]

Make sure you also import the FormsModule in the feature module which holds the component where you are using the ngModel.

@NgModule({
  imports: [FormsModule], 
  declarations:[ShowChatComponent] 
})
export class ShowChatModule {}

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 Touhid Rahman