How to get TemplateRef of a component in angular2?

Question

I have one component and need to pass your TemplateRef to a directive that will use createEmbeddedView method to replicate this component in a modal.

I tried this, but not had success.

<template let-ref>
    <my-component [myDirective]="ref"></my-component>
</template>

How i do this ?

Answer 1

In the template create a variable at the ng-template level:

<ng-template #templateref>
  <div>Your template content</div>
</ng-template>

In the component use it with @ViewChild, it will be available OnInit.

@Component({
  selector: 'my-component',
  templateUrl: 'my-component.html'
})
export class MyComponent implements OnInit {
  @ViewChild('templateref') public templateref: TemplateRef<any>;

  ngOnInit() {
    console.log(this.templateref);
  }
}

Probably the ViewChild declaration can be simplified, I haven't tested it more than that.