Angular 4:无法实例化循环依赖! InjectionToken_HTTP_INTERCEPTORS [英] Angular 4: Cannot instantiate cyclic dependency! InjectionToken_HTTP_INTERCEPTORS

查看:541
本文介绍了Angular 4:无法实例化循环依赖! InjectionToken_HTTP_INTERCEPTORS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道,这个问题听起来很重复,并且我已经尝试了所有在stackover流上发现的问题,但无法解决此问题,所以请多多包涵

I know, this question may sound duplicate and I have tried everything found on stackover flow unable to resolve this problem, so please bear with me

为了使您能够重现错误,我正在为您提供完整的代码

To make you able to reproduce the error I am providing you the whole code thought this

Github存储库

问题

我遇到以下错误:

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

Provider parse errors:↵Cannot instantiate cyclic dependency! InjectionToken_HTTP_INTERCEPTORS ("[ERROR ->]"): in NgModule AppModule in ./AppModule@-1:-1

有关场景的信息(注释)

注释1 文件:响应-interceptor.service.ts

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

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

I am intercepting the HTTPClient responses to check the 401 error and when the error comes I need to ask user to re-login.

为了向用户显示重新登录提示,我制作了具有功能"relogin"的global-functions-services

To show the re-login prompt to user I have made a global-functions-services that has a function 'relogin'

注释2 文件:路径:./src/app/shared/services/helper-services/global-function/

这是所有事情开始发生的地方... 我一旦注入PersonService

Here is the place where this all started to happen... As soon as I am injecting the PersonService

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

我收到此错误,并在

I am getting this error and in PersonService I cannot find any import that can cause the issue.

PersonService :
./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>;
  }
}

请求

请为此提出一个解决方案,我已经浪费了两天时间来找出问题所在,但没有运气.

Please suggest a solution for this, I have already wasted 2 days to figure out the issue but no luck.

非常感谢!!提前

推荐答案

循环依赖,意味着无休止地盘旋,就像行星绕着太阳公转.

Cyclic dependency, means circling around endless, like planets orbiting sun..

解决方案:打破依赖关系链,重构代码.

Solution: Break the dependency chain, Re-factor code.

您具有 GlobalFunctionService -> PersonService->依此类推...-> ResponseInterceptorService->并返回-> GlobalFunctionService .
循环完成.

You have GlobalFunctionService -> PersonService -> so on... -> ResponseInterceptorService -> and back to -> GlobalFunctionService.
Cycle complete.

从GlobalFunctionService中删除PersonService依赖项. (无论如何,如果您需要它,就不要使用它,然后找到其他解决方法.)

REMOVE the PersonService dependency from GlobalFunctionService. (its not used anyway, if you need it then find different way to get around.)

      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;
          });
        }
      }

这篇关于Angular 4:无法实例化循环依赖! InjectionToken_HTTP_INTERCEPTORS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆