Ionic 4 - Ionic Input Two-Way Binding

Question

In Ionic 4 how do you do two-way binding. In Ionic 3 I would do the following:

<ion-item color="light"> <ion-input type="string" placeholder="Username" [(ngModel)]="username"></ion-input> </ion-item>

However in Ionic 4 I get the following error:

Can't bind to 'ngModel' since it isn't a known property of 'ion-input'.
1. If 'ion-input' is an Angular component and it has 'ngModel' input, then verify that it is part of this module.
2. If 'ion-input' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("d>
          <ion-item color="light">
              <ion-input type="string" placeholder="Username" [ERROR ->][(ngModel)]="username"></ion-input>
          </ion-item>
          <ion-item color="light">
"): ng:///AppModule/LoginPage.html@12:62

How do I get this working in Ionic 4?

Deepika Wadhera · Accepted Answer · 2018-09-18 06:16:35Z

12

Please keep in mind to add the FormsModule to your module or create a SharedModule to import and export FormsModule

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    RouterModule.forChild([
      {
        path: '',
        component: HomePage
      }
    ])
  ],
  declarations: [HomePage]
})
export class HomePageModule { }

answered Sep 18, 2018 at 6:16

Deepika Wadhera

3202 silver badges8 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Tahseen Quraishi · Accepted Answer · 2019-04-15 12:24:41Z

0

You just need to import FormsModule in app.module.ts. As i have already gave the answer in detail. Visit to the link for detail https://stackoverflow.com/a/55684045/7983887

answered Apr 15, 2019 at 12:24

Tahseen Quraishi

1,5931 gold badge15 silver badges17 bronze badges

Comments

Akhil Sivanandan · Accepted Answer · 2020-04-29 08:15:57Z

0

Add FormsModule in the your Angular module

answered Apr 29, 2020 at 8:15

Akhil Sivanandan

3321 gold badge2 silver badges11 bronze badges

Collectives™ on Stack Overflow

Ionic 4 - Ionic Input Two-Way Binding

3 Answers 3

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Linked

Related