Question

我创建了一个自定义指令，用于在新选项卡中打开链接，当在ng服务中运行时，它可以正常工作。但是，当我尝试使用ng build --prod时，它显示了以下错误：

错误无法在C中解析OpenLinkInNewTabDirective的所有参数：/Users/myApp/src/app/directives/open-link-in-new-tab.directive.ts :( [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中设置＆＃34; emitDecoratorMetadata＆＃34;：true。先感谢您。

Answer 1

这是众所周知的问题，因为Window是一个打字稿界面。您需要通过创建假类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和特定comment

的详细信息

无法解析自定义指令

1 个答案: