Angular4:无法实例化循环依赖! InjectionToken_HTTP_INTERCEPTORS
Angular 4: Cannot instantiate cyclic dependency! InjectionToken_HTTP_INTERCEPTORS
我知道,这个问题可能听起来很重复,我已经尝试了在 stackover flow 上找到的所有方法都无法解决这个问题,所以请耐心等待
为了让您能够重现错误,我向您提供了完整的代码
问题
我收到以下错误:
Provider parse errors:↵Cannot instantiate cyclic dependency!
InjectionToken_HTTP_INTERCEPTORS ("[ERROR ->]"): in NgModule AppModule
in ./AppModule@-1:-1
场景信息(备注)
注1
文件:response-interceptor.service.ts
路径:./src/app/shared/interceptors/response-interceptor/
我正在拦截 HTTPClient
响应以检查 401
错误,当错误出现时我需要要求用户重新登录。
为了向用户显示重新登录提示,我制作了一个具有函数 'relogin'
的 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 天的时间来解决问题,但运气不好。
非常感谢!!提前
您必须修改您的回复-interceptor.service.ts
import { Injectable,Inject, Injector } from '@angular/core';
constructor( inj: Injector) {
this._globalFunctionService=inj.get(GlobalFunctionService)
}
您可以获得更多信息From this link
循环依赖,就是无限循环,就像行星绕着太阳转..
解决方案:打破依赖链,重构代码。
您有 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;
});
}
}
在构造函数中使用 setTimeout() 函数分配服务。
constructor(private injector: Injector) {
setTimeout(() => {
this.loginService = this.injector.get(LoginService);
})
}
试试这个,如果遇到任何问题,请返回。
我知道,这个问题可能听起来很重复,我已经尝试了在 stackover flow 上找到的所有方法都无法解决这个问题,所以请耐心等待
为了让您能够重现错误,我向您提供了完整的代码
问题
我收到以下错误:
Provider parse errors:↵Cannot instantiate cyclic dependency! InjectionToken_HTTP_INTERCEPTORS ("[ERROR ->]"): in NgModule AppModule in ./AppModule@-1:-1
场景信息(备注)
注1 文件:response-interceptor.service.ts
路径:./src/app/shared/interceptors/response-interceptor/
我正在拦截 HTTPClient
响应以检查 401
错误,当错误出现时我需要要求用户重新登录。
为了向用户显示重新登录提示,我制作了一个具有函数 'relogin'
的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 天的时间来解决问题,但运气不好。
非常感谢!!提前
您必须修改您的回复-interceptor.service.ts
import { Injectable,Inject, Injector } from '@angular/core';
constructor( inj: Injector) {
this._globalFunctionService=inj.get(GlobalFunctionService)
}
您可以获得更多信息From this link
循环依赖,就是无限循环,就像行星绕着太阳转..
解决方案:打破依赖链,重构代码。
您有 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;
});
}
}
在构造函数中使用 setTimeout() 函数分配服务。
constructor(private injector: Injector) {
setTimeout(() => {
this.loginService = this.injector.get(LoginService);
})
}
试试这个,如果遇到任何问题,请返回。