How to manually compile HTML template for Angular 2 directive.

[Andrey Gromozdov]

Hello masters. 

I need a manually compile HTML template for angular 2 directive.

Thanks in advance.

Code example:

@Directive({ selector: '[layout]' }) 
export class Layout { 
  constructor( private templateRef: TemplateRef, private viewContainer: ViewContainerRef){ } 
  @Input() set layout(value) { 
    if (value) { 
      // Only for example 
      var div = document.createElement('div'); 
      div.innerHTML = '<header>This is {{value}} header</header>'; 
      // ??? How to put the div element to the View 

      var embeddedViewRef = this.viewContainer.createEmbeddedView(this.templateRef); 
    } else { 
      this.viewContainer.clear(); 
    } 
  } 
}

[Andrey Gromozdov]

An Angular 1.x directive has link parameter that can compile HTML template and bind with element and scope.

Code example:

function link(scope, element, attrs) {
 element.html('<div>Hello {{name}}</div>');
 $compile(element.contents())(scope);
}

And that in angular 2?

 

[dashng]

This is angular 1's compile directive .

在 2016年3月10日星期四 UTC+8上午12:49:45，Andrey Gromozdov写道：