javascript - Angular 5:无法解析e:(？)的所有参数

我在Angular 5中使用angular-cli。我试图创建一个使用其他服务本身的服务。

但是，我不断收到“无法解析[service name]的所有参数：（？）”的交替错误。和“无法解析e：（？，？，？，？）的所有参数。”

这是我的设置：

MyLoggerService

import { Injectable, Inject, forwardRef } from "@angular/core";
import { OtherLoggerService } from "@A/AServices";
// OtherLoggerService is from a package I installed via npm, so I won't include it here.

// I thought I was missing this @Injectable decorator, but adding it to my
//code gives me the e: (?, ?, ?, ?) error
//Without this @Injectable() line, I get the MyLoggerService: (?) error.
@Injectable()
export class DMLoggerService extends {
    constructor(
        @Inject(forwardRef(() => OtherLoggerService)) private otherLoggerService: OtherLoggerService
    ) { }

    public logEvent(): void {
        this.otherLoggerService.logEvent();
    }
    public trackPageView(): void {
        this.otherLoggerService.trackPageView();
    }
}

我的组件

import { Component, Inject, forwardRef} from "@angular/core";
import { OtherLoggerService} from "@A/AServices";
import { MyLoggerService } from "../../common/services/mylogger.service";
import { AnotherService } from "@A/AServices";

@Component({
    selector: "my-component",
    templateUrl: "./my-component.component.html"
})
export class MyComponent{
    constructor(
        @Inject(forwardRef(() => MyLoggerService)) private myLoggerService: MyLoggerService,
        private anotherService: AnotherService
    ) {
        this.myLoggerService.trackPageView();
        this.anotherService.someFunc();
    }
}

我的模块

import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { CommonModule } from "@angular/common";
import { OtherLoggerService} from "@A/AServices"; // Just added this per comments, but still receive the same errors
import { MyLoggerService } from "../../common/services/mylogger.service";
import { AnotherService } from "@A/AServices";

@NgModule({
    imports: [
        CommonModule
        BrowserModule
    ],
    declarations: [],
    providers: [OtherLoggerService, MyLoggerService, AnotherService]
    // Added OtherLoggerService to this array but still received errors
})
export class MyModule { }

问题出在某处与喷油器有关，但是我不确定去哪里。我一直在圈子里交替出现同样的两个错误。

据我了解，我没有使用任何Barrels，因此理想情况下，它不应该是导入顺序问题。

我见过类似的主题，但尚未找到任何可行的解决方案。

编辑：“ OtherLoggerService”和“ AnotherService”都是从我通过npm安装的软件包中引入的服务，因此我不会在此处发布其内容。但是，如果使用它们有什么我可以学习的或需要记住的，请分享您的评论。

编辑：在OtherLoggerService上为MyModule添加了导入，但仍收到错误。

编辑：尝试将OtherLoggerService添加到MyModule上的Providers数组中，仍然会收到错误。

最佳答案

我想通了！

类似于对此问题的回答和评论：Angular DI Error - EXCEPTION: Can't resolve all parameters

看来我已经在我的代码中使用providers的MyModule数组中包含的不同服务创建了循环依赖关系。

我从AnotherService导入的我称为@A/AServices的服务实际上包含在根模块级别，在我本人没有亲自编写或查看的文件中。 （对于我来说，来自@A/AServices的所有服务都已包含在根模块中。）为了解决我的问题，我只是从AnotherService数组中删除了providers。

同样，我也不需要包含OtherLoggerService，因为它也是@A/AServices的一部分。

即使我在模块级别从providers数组中删除了它们，并在MyModule中也删除了import语句，我仍然能够在MyComponent中使用它们，并且仍然需要在MyComponent中将它们导入，像平常一样。

这是我更新的代码：

MyLoggerService（不变）

import { Injectable, Inject, forwardRef } from "@angular/core";
import { OtherLoggerService } from "@A/AServices";

@Injectable()
export class DMLoggerService extends {
    constructor(
        @Inject(forwardRef(() => OtherLoggerService)) private otherLoggerService: OtherLoggerService
    ) { }

    public logEvent(): void {
        this.otherLoggerService.logEvent();
    }
    public trackPageView(): void {
        this.otherLoggerService.trackPageView();
    }
}

MyComponent（已删除OtherLoggerService导入，因为我将其注入到MyLoggerService中，因此它已包含在MyLoggerService导入中）

import { Component, Inject, forwardRef} from "@angular/core";
import { AnotherService} from "@A/AServices";
import { MyLoggerService } from "../../common/services/mylogger.service";

@Component({
    selector: "my-component",
    templateUrl: "./my-component.component.html"
})
export class MyComponent{
    constructor(
        private myLoggerService: MyLoggerService,
        @Inject(forwardRef(() => AnotherService)) private anotherService: AnotherService
    ) {
        this.myLoggerService.trackPageView();
        this.anotherService.someFunc();
    }
}

MyModule（已删除对AnotherService和OtherLoggerService的引用，因为它们包含在根模块中。还对@NgModule属性进行了一些小的更改）

import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { CommonModule } from "@angular/common";
import { MyLoggerService } from "../../common/services/mylogger.service";

@NgModule({
    imports: [
        CommonModule
        BrowserModule
    ],
    declarations: [MyComponent],
    providers: [MyLoggerService], // removed the services here that were causing the circular dependency
    exports: [MyComponent]
})
export class MyModule { }

我还要向以后的读者指出，我在概述@Inject(forwardRef(() => ServiceName))和constructor的MyLoggerService中的参数时使用MyComponent的原因是我对我使用的服务的技术要求npm包@A/AServices，对于我自己创建的任何服务，当我在构造函数中包含该服务时，无需使用此forwardRef方法。