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??

If you use a component inside your service, you are probably doing something not in the right way. Mixing up dependencies and coupling classes. What's the reason you inject the Component? — Poul Kruijt
– Poul Kruijt, Commented Apr 1, 2019 at 7:23

Ashish Ranjan · Accepted Answer · 2019-04-01 07:24:11Z

3

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.

answered Apr 1, 2019 at 7:24

Ashish Ranjan

13k5 gold badges32 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

WARNING in Circular dependency detected:

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related