Angular中ngTemplateOutlet和指令结合使用

在kendo的Grid组件中，可以看到有大量类似kendoGridCellTemplate这样的指令。 那么这些指令是怎样实现的。

    
        
            
                ....
            
        
    

• 下面是实现 在HelloComponent组件中使用 helloTemplate指令的代码

@Component({
    selector: 'hs-hello',
    template: `
        

            ...
            
        

    `
})
export class HelloComponent {

    ctx = {
        $implicit: 'aaa',
        hello: 'bbb'
    };

    @ContentChild('cellTemplate') ct: TemplateRef;

    constructor() {}

}

    
@Directive({
    selector: '[helloTemplate]',
})
export class HelloTemplateDirective implements OnInit {

    constructor(
        private template: TemplateRef,
        @Host() @Optional() public hc: HelloComponent
    ) {

    }

    ngOnInit() {
        this.hc.headerTemplate = this.template;
    }
}

    
        
            
{{dataItem}} -- {{hello}}