Ionic Angular 4.8 use of components

Ionic Framework
1

Hello! Earlier have work with Angular with frontend project and know that components should be declared in the module.
But declaration in Ionic 4/Angular 4.8 doesn’t solve the problem:

Error: Component ImagesListComponent is not part of any NgModule or the module has not been imported into your module.
Error: Component ImagesListComponent is not part of any NgModule or the module has not been imported into your module.

app.module.ts

@NgModule({
  declarations: [AppComponent, ImagesListComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

images-list.component.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';

import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ImagesListComponent } from './images-list/images-list-component.component';

@Component({
  selector: 'app-images-list',
  templateUrl: './images-list.component.html',
  styleUrls: ['./images-list.component.scss'],
})
export class ImagesListComponent implements OnInit {

  constructor() { }

  ngOnInit() {}

}

tabs.router.module.ts

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TabsPage } from './tabs.page';
import {ImagesListComponent} from '../images-list/images-list.component';

const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: 'catalog',
        children: [
          {
            path: '',
            component: ImagesListComponent
          }
        ]
      }
    ]
  },
  {
    path: '',
    redirectTo: '/tabs/catalog',
    pathMatch: 'full'
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class TabsPageRoutingModule {}

Please, give me an example based on tabs project.

Thanks!

2

In your

Add this : ImagesListComponent

And add this: schemas: [CUSTOM_ELEMENTS_SCHEMA],

In your page.spec.ts

image

I hope this help!

3

I am also experiencing the same error.
My first is question how to navigate to a component from a page .
and how to remove this error : Component SelectRoomComponent is not part of any NgModule or the module has not been imported into your module.

4

Hello! The best way is to register all your components in one module. Then you import this module to every page where you need to use component.