angular – 如何解决循环依赖

前端之家收集整理的这篇文章主要介绍了angular – 如何解决循环依赖前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有3项服务:

auth.service.ts,account.service.ts,http.service.ts

用户注册时我应该创建新帐户,因此我将account.service.ts导入auth.service.ts.我应该这样做,因为我使用注册表单数据来创建一个新帐户.

@Injectable()
export class AuthService {
  constructor(public accountService: AccountService) {}

  signUp(name: string,phone: string,email: string,password: string): void {

    ...

  userPool.signUp(phone,password,attributeList,null,(err: any,result: any) => {
  if (err) {

    ...

    return;
  }

  this.accountService.createAccount(name,phone,email).subscribe(res => {

    ...

    this.router.navigate(['/auth/confirmation-code']);
  });
});

}

因此,当我使用AWS Cognito时,我应该将auth.service.ts中的授权令牌添加到http.service.ts
    因此我将auth.service.ts导入http.service.ts.

@Injectable()
export class HttpService {
  private actionUrl: string;
  private headers: Headers;
  private options: RequestOptions;

  constructor(
    public _http: Http,public authService: AuthService 
  ) {
    this.actionUrl = 'https://example.com/dev';
    this.headers = new Headers();

    this.authService.getAuthenticatedUser().getSession((err: any,session: any) => {
      if(err) return;
      this.headers.append('Authorization',session.getIdToken().getJwtToken());
    });

    this.headers.append('Content-Type','application/json');
    this.headers.append('Accept','application/json');
    this.headers.append('Access-Control-Allow-Headers','Content-Type,X-XSRF-TOKEN');
    this.headers.append('Access-Control-Allow-Origin','*');

    this.options = new RequestOptions({ headers: this.headers });
  }

    get(request: string): Observable<any> {
        return this._http.get(`${this.actionUrl}${request}`)
            .map(res => this.extractData(res))
            .catch(this.handleError);
   }

在我的account.service.ts中,我应该使用http.service.ts来创建新帐户.

@Injectable()
export class AccountService {
  constructor(public httpService: HttpService) {}

WARNING in Circular dependency detected:
src/app/core/services/account.service.ts -> src/app/core/services/http.service.ts -> src/app/core/services/auth.service.ts -> src/app/core/services/account.service.ts

WARNING in Circular dependency detected:
src/app/core/services/auth.service.ts -> src/app/core/services/account.service.ts -> src/app/core/services/http.service.ts -> src/app/core/services/auth.service.ts

WARNING in Circular dependency detected:
src/app/core/services/http.service.ts -> src/app/core/services/auth.service.ts -> src/app/core/services/account.service.ts -> src/app/core/services/http.service.ts

据我所知,这是循环依赖错误.
怎么解决?最佳实践?
所有服务都履行其职责并且非常重要.

解决方法

您可以使用Injector.像往常一样通过构造函数注入它,然后当您需要一些导致循环依赖的服务时,从中获取该服务.

class HttpService {
  constructor(private injector: Injector) { }

  doSomething() {
    const auth = this.injector.get(AuthService);
    // use auth as usual
  }
}

猜你在找的Angularjs相关文章