Home > Back-end >  nfFor Command in Ionic is not working inside a component
nfFor Command in Ionic is not working inside a component

Time:09-22

I'm creating a Ionic App in Ionic / Angular. I created some pages and its working fine. But now I'm trying to create a component, but I can't use *ngFor command.

I created the componente using Ionic cli. this is my HTML:

<ion-item button *ngFor="let myItem of myCollection">
    (...)
</ion-item> 

I've already used ngFor inside a page and it worked, but known inside the componente I'm getting the following error:

core.js:10140 NG0303: Can't bind to 'ngForOf' since it isn't a known property of 'ion-item'.

I've searched this problem, and was suggested to put BrowserModule in app and CommonModule in my page module. My App already have it and every page too, but my component doesn't have a module file, where should i put it? Or how can i solve this problem?

These are the versions I'm using :

Ionic CLI                     : 6.16.1 (C:\Users\User\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework               : @ionic/angular 5.6.9
@angular-devkit/build-angular : 0.1102.14
@angular-devkit/schematics    : 11.2.14
@angular/cli                  : 11.2.14
@ionic/angular-toolkit        : 3.1.1

CodePudding user response:

Since your component doesn't have a module, you need to add your component in the declarations inside the page module where you want to add the component. See sample code below:

@NgModule({
  imports: [
    BrowserModule,
    CommonModule,
    ....
  ],
  declarations: [
    UserComponent // Add the components name to the module declarations
  ]
})

export class SamplePageModule {}
  • Related