href指令在Angular中不起作用

Question

我已设置以下指令来捕获所有href上的点击：

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

@Directive({
    selector : '[href]',
    host : {
        '(click)' : 'doNothing($event)'
    }
})
export class HrefTelDirective {
    @Input() href: string;

    constructor(el: ElementRef) {
        console.log('href loaded');
        console.log(el);
    }

    doNothing(event) {
        // if(this.href.length === 0 || this.href === '#') {
        //     event.preventDefault();
        // }
        console.log('href clicked');
    }
}

我将指令加载到不同的模块上，包括核心模块，共享模块等，但从未调用过。当我将选择器更改为其他名称（如“ myHighlightDirective”）时，它将被调用。