无法解析自定义指令的所有参数

Question

我创建了一个自定义指令以在新选项卡中打开 link，当在 ng serve 中打开运行时，它起作用了。但是，当我在 ng build --prod 中尝试时，它显示了这个错误：

无法解析 C:/Users/myApp/src/app/directives/open-link-in-new-tab.directive.ts 中 OpenLinkInNewTabDirective 的所有参数时出现错误：([object Object], ?).

指令如下：

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

@Directive({ selector: '[newTab]' })
export class OpenLinkInNewTabDirective {
    constructor(
      private el: ElementRef,
      @Inject(Window) private win:Window
    ) {}

    @Input('routerLink') link: string;
    @HostListener('mousedown') onMouseEnter() {
        this.win.open(this.link || 'main/default');
    }
}

我已经在 tsconfig.json 中设置了 "emitDecoratorMetadata": true。先感谢您。

Answer 1

这是一个已知问题，因为 Window 是一个打字稿接口。你需要通过创建一个假的 class 来欺骗编译器说 WindowWrapper.ts

@Injectable()
export class WindowWrapper extends Window { }
export function getWindow() { return window; }

app.module:

import { WindowWrapper, getWindow } from './WindowWrapper';

providers: [
     {provide: WindowWrapper, useFactory: getWindow}
  ],

指令：

import { Directive, ElementRef, HostListener, Input, Inject } from '@angular/core';
import { WindowWrapper } from './WindowWrapper';

@Directive({ 
    selector: '[newTab]'
})
export class OpenLinkInNewTabDirective {
    constructor(
      private el: ElementRef,
      @Inject(WindowWrapper) private win: Window) {}

    @Input('routerLink') link: string;
    @HostListener('mousedown') onMouseEnter() {
        this.win.open(this.link || 'main/default');
    }
}

查看更多详细信息 isse and that particular comment

无法解析自定义指令的所有参数

Can't resolve all parameters for custom directive

angular2-directives

angular-cli

angular