WARNING in Circular dependency detected:

Question

test2\\test2.services.ts

import { test1Component } from '../test1/test1.component';
constructor(public tsoComp: test1Component ) { }
betState

test1.component.ts

import { test2Service } from '../test2/test2.services';
constructor(public test2S: test2Service)
someCode(){
  this.test2S.betState = n;
}

error: WARNING in Circular dependency detected:

src\\app\\layout\\sports\\sport\\test2\\test2.services.ts -> src\\app\\layout\\sports\\sport\\test1\\test1.component.ts -> src\\app\\layout\\sports\\sport\\test2\\test2.services.ts

Why is this wrong??

Answer 1

When angular will look at your code and try to create Objects for your component and the service, it will do that one by one, lets say it starts with creating the service object first, in the service's constructor, you have mentioned that it need a dependency injection of test1Component component, then it will say okay lets create an Object of test1Component . Now it goes to create an instance of of test1Component but there you say that it needs test2Service so creation of these instances are deadlocked, so the circular dependency.

Usually we don't inject a component in a service, please check your requirements.