angular - 如何在angular2中获取组件的TemplateRef？

Question

我有一个组件，需要将您的 TemplateRef 传递给一个指令，该指令将使用 createEmbeddedView 方法在模态中复制该组件。

我试过了，但没有成功。

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

我该怎么做？

Answer 1

在模板中创建一个 ng-template 级别的变量:

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

在与@ViewChild 一起使用的组件中，它将在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);
  }
}

可能 ViewChild 声明可以简化，我还没有测试过。