2

I want to pass an @Input to an angular component, like this:

<some-component [childComponent]="'<child-component><child-component>'"><some-component>

Because I want to reuse the code of some-component and the @Input value will be dynamic so each time I can pass a new child component inside some-component. The child-component will be rendered inside some-component.

How can I achieve this?

Thanks for help.

Arpit Kumar
  • 2,179
  • 5
  • 28
  • 53
  • 1
    HTML added dynamically is not processed by Angular in any way. You shouldn't expect `` to become a component if you pass it around as String and then add it to the DOM eventually, also any bindings like `[prop]="..."`, `(fooEvent)="..."`, or `"{{...}}"`, won't do anything. What you can do is to pass component types around and instantiate and add components dynamically. See for example https://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468 – Günter Zöchbauer Sep 07 '17 at 10:53
  • Read [Here is what you need to know about dynamic components in Angular](https://blog.angularindepth.com/here-is-what-you-need-to-know-about-dynamic-components-in-angular-ac1e96167f9e) to understand why html added dynamically is not processed by Angular – Max Koretskyi Sep 07 '17 at 14:17

0 Answers0