Angular 2 load component using 'selector' dynamically

Question

I am facing an issue in angular 2 for load component based on 'selector' name.

I want to render component in my popup dynamically. Something like this - Here is the code:

<div>
 <my-selector></my-selector>
</div>

I want to render component inside the div.

Why are you using version 2? Current version is 5.x and it's mostly backward compatible. — Lazar Ljubenović
– Lazar Ljubenović, Commented Jan 17, 2018 at 7:34
You should add your component.ts file as well as the HTML so that we can see if there is anything wrong there — Ørjan
– Ørjan, Commented Jan 17, 2018 at 7:41
@ekanojia They mean, when asking a question, you should show code. Nobody can help you with this description. — Lazar Ljubenović
– Lazar Ljubenović, Commented Jan 17, 2018 at 7:53
@LazarLjubenović is correct you should add files for us to help you , guessing that you are in search for dynamic components , You should check Angular Dynamic components on how to load them — Rahul Singh
– Rahul Singh, Commented Jan 17, 2018 at 8:50

Ørjan · Accepted Answer · 2018-01-22 11:44:34Z

1

Regarding the question and the plunker mentioned in the comments above. To make you selector work, you just have to add the Component in your AppModule like this.

declarations: [ App, PopupComponent, DynamicComponent ]

When you have added the component here, you can use the selector as you want in the App template like this:

<button (click)="openPopup()">Launch demo modal</button>
<hr>
<div>
   <my-selector></my-selector>
</div>
<pre>{{closeResult}}</pre>

answered Jan 22, 2018 at 11:44

Ørjan

2,8792 gold badges19 silver badges25 bronze badges

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

1 Comment

e kanojia Over a year ago

But i want to load selector dynamically say in one popup i want to load <my-selector></my-selector> in another popup i wan to load <my-selector1></my-selector1> in same html

Collectives™ on Stack Overflow

Angular 2 load component using 'selector' dynamically

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related