Angular提供者和providerIn导致循环依赖

时间:2018-10-15 09:08:22

标签: angular

我是新手,所以我对你们有一个非常基本的问题。

几个月前,我开始了一个项目,当我创建服务时,将其添加到模块中的提供者数组中。 像这样:

import { Injectable } from '@angular/core';

import { MatchService } from '../../core/services/match.service';
import { Answer } from '../../core/models/answer';
import { Product } from '../../core/models/product';

@Injectable()
export class ScenarioMatchService {

  constructor(
    private matchService: MatchService
  ) { }

  find(product: Product, answers: Answer[]): string[] {
    var descriptions: string[] = [];

    answers.forEach(answer => {
      var formulas = answer.formulas;
      var match = this.matchService.matchProductUsingFormulas(product, formulas);
      if (match)
        descriptions.push(answer.text);
    })

    return descriptions;
  }
}

在我的模块中,我会有类似providers: [ScenarioMatchService]的内容。这似乎工作正常。 我注意到有一天在创建服务时获得了新装饰:

@Injectable({ providedIn: 'root' })

所以我读了这篇文章: https://angular.io/guide/providers

现在,我有一个CoreModule,用于存放我的单例服务。因此,我认为将驻留在该文件夹中的所有服务更新到以下位置是一个好主意:

@Injectable({
  providedIn: CoreModule
})

但是现在我收到来自angular的警告:

  

警告:在循环依赖项中检测到:   src \ app \ core \ animations \ animations.component.ts-> src \ app \ core \ services \ animation.service.ts-> src \ app \ core \ core.module.ts-> src \ app \ core \ animations \ animations.component.ts

我在做错什么导致这种情况?

2 个答案:

答案 0 :(得分:0)

错误消息清楚地表明您的配置中存在循环依赖性。

从您用

配置的core.module.ts providers中删除所有这些服务
@Injectable({
  providedIn: CoreModule
})

答案 1 :(得分:0)

https://github.com/angular/angular-cli/issues/10170

以上文章解决了我的问题。 我用@Injectable({{provedIn:'root'})替换了所有@Injectable({ providedIn: CoreModule }),并使用模块 providers 数组(例如,旧的方式)