使用Angular指令添加引导弹出窗口

Question

我正在尝试使用Angular指令向元素添加引导程序：

import { Directive, ElementRef, Input, OnInit, Renderer } from '@angular/core';

@Directive( {
    selector: '[myPopup]'
} )

export class MyPopupDirective implements OnInit
{
    constructor(
        private element: ElementRef,
        private renderer: Renderer,
    ) { }

    ngOnInit()
    {
        this.renderer.setElementAttribute( this.element.nativeElement, "triggers", "mouseenter:mouseleave" );
        this.renderer.setElementAttribute( this.element.nativeElement, "ngbPopover", "Hello World!!" );
        this.renderer.setElementAttribute( this.element.nativeElement, "popoverTitle", "Testing" );
    }
}

我打算使用@Input参数，以便可以自定义弹出窗口，因此我假设使用implements OnInit是正确的路径。这是我的用法：

<a myPopup href="...">Hover for popup</a>

我可以说我的指令有效，因为属性已添加到HTML，但是弹出窗口无效。我在不使用指令的情况下内联添加了popup属性，并且一切正常。我注意到使用伪指令时没有ng-reflect-*属性，但是当我内联添加属性时却没有。我尝试将ngOnInit中的代码移到构造函数中，但仍然无法正常工作。