Angular 4：无法实例化循环依赖！ InjectionToken_HTTP_INTERCEPTORS

Question

我知道，这个问题听起来可能是重复的，我已经尝试了在 stackover flow 上找到的所有方法都无法解决这个问题，所以 请耐心等待

为了让您能够重现错误，我为您提供了整个代码，我认为这是

Github 回购

问题

我收到以下错误：

提供者解析错误：↵无法实例化循环依赖！ InjectionToken_HTTP_INTERCEPTORS (”[ERROR ->]”): 在 NgModule AppModule 中./AppModule@-1:-1

有关场景的信息（注释）

注1 文件： response-interceptor.service.ts

路径： ./src/app/shared/interceptors/response-interceptor/

我正在拦截 HTTPClient 响应以检查 401 错误，当错误出现时我需要要求用户重新登录。

为了向用户显示重新登录提示，我制作了一个 global-functions-services 具有“重新登录”功能

注释 2 文件： global-function.service.ts

路径： ./src/app/shared/services/helper-services/global-function/

这是这一切开始发生的地方……我一注射 PersonService

   constructor(
    public dialog: MatDialog,
    private _personService: PersonService
  ) { }

我收到此错误，在 PersonService 中我找不到任何可能导致此问题的 import 。

人员服务：

./src/app/shared/services/api-services/person/person.service.ts

 import { IRequest } from './../../../interfaces/I-request';
import { environment } from 'environments/environment';
import { Injectable } from '@angular/core';

// for service
import 'rxjs/add/operator/map'
import 'rxjs/add/operator/toPromise';

// models
import { Person } from 'app/shared/models/person';
import { RequestFactoryService, REQUEST_TYPES } from 'app/shared/factories/request-factory/request-factory.service';

@Injectable()
export class PersonService {
  private _requestService: IRequest;

  constructor(
    _requestFactoryService: RequestFactoryService
  ) {
    this._requestService = _requestFactoryService.getStorage(REQUEST_TYPES.HTTP);
  }

  public signup(record): Promise<Person> {
    let url = environment.api + 'person/public/signup';

    return this._requestService.post(url, record)  as Promise<Person>;;
  }

  public authenticate(code: string, password: string): Promise<Person> {
    let url = environment.api + 'auth/signin';

    let postData = {
      code: code,
      password: password
    }

    return this._requestService.post(url, postData) as Promise<Person>;
  }
}

要求

请为此提出一个解决方案，我已经浪费了 2 天的时间来解决这个问题，但没有运气。

非常感谢！！提前

原文由 Vikas Bansal 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

循环依赖，意味着无限循环，就像行星绕着太阳转。

解决方案：打破依赖链，重构代码。

您有 GlobalFunctionService -> PersonService -> 等等… -> ResponseInterceptorService -> 并返回 -> GlobalFunctionService 。

循环完成。

从 GlobalFunctionService 中删除 PersonService 依赖项。 （无论如何它都没有使用，如果你需要它然后找到不同的方式来解决。）

       import { PersonService } from 'app/shared/services/api-services/person/person.service';
      import { Injectable } from '@angular/core';
      import { InputModalComponent } from 'app/shared/components/input-modal/input-modal.component';
      import { MatDialog } from '@angular/material';

      @Injectable()
      export class GlobalFunctionService {

        constructor(
          public dialog: MatDialog
        ) { }

        relogin(): void {
          let dialogRef = this.dialog.open(InputModalComponent, {
            width: '250px',
            data: { title: "Please provide your password to re-login." }
          });

          dialogRef.afterClosed().subscribe(result => {
            debugger
            console.log('The dialog was closed');
            let password = result;
          });
        }
      }

原文由 dipak 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

在构造函数中使用 setTimeout() 函数来分配服务。

 constructor(private injector: Injector) {
  setTimeout(() => {
      this.loginService = this.injector.get(LoginService);
  })
}

试试这个，如果遇到任何问题，请返回。

原文由 Jayendra Bariya 发布，翻译遵循 CC BY-SA 3.0 许可协议