可以通过编写自定义指令,在ng-template元素中嵌入内容。下面是一个例子:
在模板中添加一个ng-template元素和一个包含ng-template指令的div。
Nested content goes here
Template Content
下面是指令的代码:
import { Directive, TemplateRef, ViewContainerRef } from '@angular/core';
@Directive({
selector: '[myDirective]'
})
export class MyDirective {
constructor(private templateRef: TemplateRef,
private viewContainer: ViewContainerRef) { }
ngOnInit() {
this.viewContainer.createEmbeddedView(this.templateRef);
}
}
这个指令将包含在ng-template中的内容嵌套到指令所在的div中。在这个例子中,内容是“Nested content goes here”。ng-template指令将在指定的ng-template元素上创建一个TemplateRef对象。然后,通过viewContainer.createEmbeddedView方法将这个TemplateRef嵌入到指令所在的元素中。
最后,应该可以看到模板中的内容如下所示:
Nested content goes here
Template Content
Template Content