0

The question is same as Equivalent of $compile in Angular 2

But I have an element

<div>Hello {{name}}!</div>

I have defined name in the class as

this.name = "<b>Mr_Perfect {{job}}</b>";
this.job  = "UI Developer";

Now, I need to compile the div dynamically. I just checked the above link and few answers are deprecated and the accepted answer in the question is good but need to write a lot of code just to compile a small element.

Are there any better methods in the recent releases of angular?

Mr_Perfect
  • 8,254
  • 11
  • 35
  • 62
  • You have to use compiler. That accepted answer does it. Here the same way https://stackoverflow.com/questions/40060498/angular-2-1-0-create-child-component-on-the-fly-dynamically – yurzui Jun 22 '17 at 11:47
  • I didn't understand that code cleary. Can you explain it as a answer? – Mr_Perfect Jun 22 '17 at 11:49
  • 1
    If you don't use any angular binding you should use `innerHTML/outerHTML` – yurzui Jun 22 '17 at 11:54
  • you should read [Here is what you need to know about dynamic components in Angular](https://hackernoon.com/here-is-what-you-need-to-know-about-dynamic-components-in-angular-ac1e96167f9e) – Max Koretskyi Jun 22 '17 at 12:59

1 Answers1

0

You could do

<div>Hello <span [innerHTML]=name></span>!</div>
Sibiraj
  • 4,486
  • 7
  • 33
  • 57
  • The main motto of the question is to know about dynamic compilation but not getting output. Check updated question – Mr_Perfect Jun 22 '17 at 11:58