Use lazy loaded components in parent module?

Question

I have a parent modules(app.module) & a child module(contacts.module). The child module is lazy loaded. The parent module utilizes a component from the child module but when I navigate to the child route I get the error:

'app-contacts-home' is not a known element:
1. If 'app-contacts-home' is an Angular component, then verify that it is part of this module.
2. If 'app-contacts-home' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to

Obviously that component isn't part of the parent module since it's being lazy loaded. I tried adding app-contacts-home as an entryComponent in contacts.module but had no luck.

How can I use a lazy loaded component in my parent component?

Octavio Garbarino · Accepted Answer · 2018-11-17 00:40:49Z

4

No you can't use a component from a child lazy load module in a parent module.

What you should do in these situations is to make a 3rd module (SharedModule) that will have the component that is used in components from both modules. Then import that 3rd module in parent and child module, that 3rd module won't be lazy loaded.

The documentation in this page https://angular.io/guide/sharing-ngmodules have useful information about that.

Hope that this helps!

answered Nov 17, 2018 at 0:40

Octavio Garbarino

7827 silver badges16 bronze badges

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

Collectives™ on Stack Overflow

Use lazy loaded components in parent module?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related