Error : No Component Factory Found. Did you add it to @NgModule.entryComponents?

Question

I am trying to create a popover on my Home Page.So I have created following function..

public presentPopover(myEvent) {
    let popover = this.popoverCtrl.create(TestComponent);
    popover.present({
      ev: myEvent
    });
  }

in my homepage.module.ts i have added testComponent as entry component.

import { TestModule } from './../../components/test/test.module';
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { HomePage } from './home';
import { TestComponent } from './../../components/test/test';

@NgModule({
  declarations: [
    HomePage,
  ],
  imports: [
    TestModule,
    IonicPageModule.forChild(HomePage),
  ],
  entryComponents: [
    TestComponent,
  ]
})

But i am still getting this error wheni click that popover button.

ERROR Error: Uncaught (in promise): Error: No component factory found for TestComponent. Did you add it to @NgModule.entryComponents?
Error: No component factory found for TestComponent. Did you add it to @NgModule.entryComponents?
    at noComponentFactoryError (core.js:3786)
    at CodegenComponentFactoryResolver.resolveComponentFactory (core.js:3850)
    at PopoverCmp._load (popover-component.js:41)
    at PopoverCmp.ionViewPreLoad (popover-component.js:33)

And I am confused why should I add this to entry Components?

Answer 1

You need to add dynamically created components to entry components inside your @NgModule

@NgModule({
  ...
  declarations: [
    ...
    Name of your component,
  ],
  entryComponents: [
    ...
    Name of your component,    
  ]
})

Note: In some cases entry components under lazily loaded modules will not work, as a workaround put them in your app.module (root)