如何获取 Angular 2 指令实例的句柄？

Question

Angular 2 rc 5 写成typescript 1.9

我想获得属性指令实例的句柄。我正在使用ViewChild，它与组件一起使用，但它给了我一个指向承载指令的元素的句柄。

模板

<span myHighlight #directive> Highlight me! </span>

组件

/** Want handle to the directive. Instead gives handle to the span element */
@ViewChild('directive') directive:HighlightDirective;

ngAfterViewInit(){
   console.log(this.directive);
}

指令

@Directive({ selector: '[myHighlight]' })
export class HighlightDirective {
    constructor(el: ElementRef, renderer: Renderer) {
       renderer.setElementStyle(el.nativeElement, 'backgroundColor', 'yellow');
    }
}

Running plunker

<span> 元素被打印到控制台，所以ViewChild 没有抓住我需要的东西。如何获得对指令实例的引用？

Answer 1

@ViewChild('directive', {read: HighlightDirective}) directive:HighlightDirective;

或

@ViewChild(HighlightDirective) directive:HighlightDirective;

但第二种方法返回第一个 HighlightDirective，而不是特定的。