Angular 4: Cannot Instantiate Cyclic Dependency! Injectiontoken_http_interceptors

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 t

Solution 1:

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

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

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

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()
      exportclassGlobalFunctionService {

        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 => {
            debuggerconsole.log('The dialog was closed');
            let password = result;
          });
        }
      }

Solution 2:

Use setTimeout() function in constructor to assign service.

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

Try this and revert back if you face any issue.

Solution 3:

You have to modify your response-interceptor.service.ts

import { Injectable,Inject, Injector } from'@angular/core';

constructor( inj: Injector) { 
   this._globalFunctionService=inj.get(GlobalFunctionService)
 }

You can get more info From this link