以角度2扩展routerLink？

Question

如何[routerLink]从 Angular Router v3扩展指令，以便我可以自己包装一些自定义功能？我查看了RouterLinkWithHref指令，看来这就是我想要扩展的内容，所以我制作了这个：

扩展路由器链接指令

import {Directive, Input} from '@angular/core';
import {RouterLinkWithHref} from "@angular/router";
import {Model} from "../Classes/Model.class";

@Directive({
    selector: 'a[extendedRouterLink]'
})
export class ExtendedRouterLinkDirective extends RouterLinkWithHref {
    @Input('extendedRouterLink') model : Model;

    // Future custom logic
}

我尝试像这样使用它：

<a [extendedRouterLink]="model">

我将它包含在directives我的组件数组中：

...
directives: [ROUTER_DIRECTIVES, ExtendedRouterLinkDirective],
...

但是，我收到以下运行时错误：

“模板解析错误：无法绑定到‘extendedRouterLink’，因为它不是已知的本机属性”

如果我extends RouterLinkWithHref从我的指令中删除，它可以正常工作而不会出错。我究竟做错了什么？

Answer 1

我也需要同样的。使用您的帖子，我能够使其发挥作用。这是缺少的内容：

@Input() mgiRouterLink: string ngOnInit() 

ngOnInit() {
    this.href = this.routerLink = this.mgiRouterLink  
}

父routeLink指令期望this.href和this.routerLink保存来自DOM属性的数据。现在看起来像这样：

import {Directive, Input} from '@angular/core';
import {RouterLinkWithHref} from "@angular/router";
import {Model} from "../Classes/Model.class";

@Directive({
    selector: 'a[extendedRouterLink]' 
}) 
export class ExtendedRouterLinkDirective extends RouterLinkWithHref {

    @Input() mgiRouterLink: string ngOnInit() 

    ngOnInit() {
        this.href = this.routerLink = this.mgiRouterLink  
    } 
}