CODEWITHSUNDEEP
angulartypescript
cup_of
cup_of

Reputation: 6697

Return component selector inside Angular TS file (Angular 2+)

Say I have a method in my TS file that returns some HTML that gets injected into the template. I would like to include another component in the return but I can't get it to work.

For example, say I have the following method in my TS file:

returnComponent() {
   return `<my-component></my-component>`
}

Every time I run this method, it seems to only return the HTML tags but not the actual component. So after running the method I get

<div>
   <my-component>
      <!-- nothing here -->
   </my-component>
</div>

And I would like to get

<div>
   <my-component>
      <!-- the contents of 'my-component' -->
   </my-component>
</div>

What am I missing? or is this not even possible?

Upvotes: 0

Views: 568

Answers (1)

Sunil
Sunil

Reputation: 11243

What actually you are looking for is dynamic template. You cannot put the dynamic template as string value. The template must reside inside the html of any component and you can take the reference of that template ng-template.

So you need to change your implementation. Its not pretty simple process as you thought.

Follow this article https://medium.com/@DenysVuika/dynamic-content-in-angular-2-3c85023d9c36

Upvotes: 1

Related Questions