# How do you use Popovercontroller?

**URL:** <https://forum.ionicframework.com/t/how-do-you-use-popovercontroller/133093>\
**Category:** ionic-v3\
**Created:** [June 18, 2018, 5:30pm UTC](https://forum.ionicframework.com/t/how-do-you-use-popovercontroller/133093 "2018-06-18T17:30:41Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Dunny](https://avatars.discourse-cdn.com/v4/letter/d/9de0a6/32.png) [@Dunny](https://forum.ionicframework.com/u/Dunny)\
**Post date:** [June 18, 2018, 5:30pm UTC](https://forum.ionicframework.com/t/how-do-you-use-popovercontroller/133093/1 "2018-06-18T17:30:41Z")

</div>

Ok, I’m currently using Ionic 4.

I’m calling the controller as below,

```auto
  async onAdditionalEvidenceSelected({event}) {
    const popover = await this.popoverCtrl.create({
      component: "PopupMenu",
      ev: event,
      translucent: true
    });
    return await popover.present();
  }

```

I’ve created a component and imported the shared module in App, and the Page, neither work.

`import { PopupMenuComponentModule } from '../../components/popup-menu/popup-menu.module';`

It complains that it wants to be an entry component,

`Error: Uncaught (in promise): Error: No component factory found for PopupMenuPage. Did you add it to @NgModule.entryComponents?`

So I tried adding it as an entry component,

```auto
PopupMenuPageModule cannot be used as an entry component.
Error: PopupMenuPageModule cannot be used as an entry component.

```

I’ve read that it can’t be used as a component and must be an Ionic Page ([https://github.com/ionic-team/ionic/issues/11111](https://github.com/ionic-team/ionic/issues/11111)) but that won’t work either.

`import { PopupMenuPageModule } from './../popup-menu/popup-menu.module';`

I’m tearing out what little hair I have left, ha

Any help appreciated.

Thanks

---

<div class="post-metadata">

**Author:** ![brilliano](https://avatars.discourse-cdn.com/v4/letter/b/d78d45/32.png) [@brilliano](https://forum.ionicframework.com/u/brilliano)\
**Post date:** [March 16, 2019, 2:05am UTC](https://forum.ionicframework.com/t/how-do-you-use-popovercontroller/133093/2 "2019-03-16T02:05:27Z")

</div>

Hi @Dunny!

The error message you received is really not helpful, but indicates that your Popover component is being loaded dynamically using a Component Factory under the hood, but things are not resolving correctly. The Ionic 4 documentation (as of the time of this post) doesn’t explain that **in order to get things working you’ll need to make the Angular Router aware of your component by adding it to the routing configuration**.

So, for your component, you’ll want to add something like the following, e.g., for a lazy loaded route:

```auto
const routes: Routes = [
	{
		path: '', 
		component: RootLazyLoadedPage,
		children: [
			{
				path: 'your-popover',
				component: PopMenuComponent
			},
		]
	}
];

```

Once you do that, the easiest way to create your popup is to use a direct reference to the `PopMenu` component rather than a string format, so you’ll want to change your example above to something like:

```auto
const popover = await this.popoverCtrl.create({
	component: PopupMenu,
	ev: event,
	translucent: true
});

```

Note the change from `"PopupMenu"` to `PopupMenu` (no quotes). That should get it working for you.

Hope this helps anyone else who’s been suffering from this documentation-related issue!

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [July 19, 2021, 9:32pm UTC](https://forum.ionicframework.com/t/how-do-you-use-popovercontroller/133093/3 "2021-07-19T21:32:04Z")

</div>


