CODEWITHSUNDEEP
angularangular-elements
Mhyland
Mhyland

Reputation: 280

How to embed an angular element inside a angular component

I am trying to build an angular application to encapsulate 2 other angular projects because 2 separate teams work on the projects and they need to be able to be shipped separately. We decided to use angular elements. and we need them to be able to be loaded after a joint login page and they need to not show up at the same time.I was able to export the projects as an angular element and import it into the index.html of the parent app but I am unable to get it working inside of a component

I have added the scripts to the index.html file, and enabled CUSTOM_ELEMENTS_SCHEMA but the app throws an error 

Error: The selector "custom-root" did not match any elements
    at DefaultDomRenderer2.selectRootElement (scripts.js:176618)
    at BaseAnimationRenderer.selectRootElement (scripts.js:174288)

I have also tried adding the js files to the script section of angular.json but that also does not work. it will also throw an error when I attempt to add them through an import command at the top of app.component.ts

Upvotes: 0

Views: 331

Answers (1)

AndyD
AndyD

Reputation: 895

Treat the custom element like just that, a custom element.

Meaning that you need to stringify all inputs and not import the module into the wrapper module.

Upvotes: 1

Related Questions