Questions tagged [angular-dependency-injection]

Use this tag if your question is specially about the behavior of the angular dependency injection framework.

Dependency injection (DI), is an important application design pattern. Angular has its own DI framework, which is typically used in the design of Angular applications to increase their efficiency and modularity.

Dependencies are services or objects that a class needs to perform its function. DI is a coding pattern in which a class asks for dependencies from external sources rather than creating them itself.

In Angular, the DI framework provides declared dependencies to a class when that class is instantiated. This guide explains how DI works in Angular, and how you use it to make your apps flexible, efficient, and robust, as well as testable and maintainable.

For more information about angular DI visit the official documentation

75 questions
68
votes
3 answers

APP_INITIALIZER raises "Cannot instantiate cyclic dependency! ApplicationRef_" when used with a custom Http provider that is redirecting

I am using a custom Http provider to handle API authentication error. In my CustomHttp, I need to redirect the user to the login page when a 401 status error is emitted by the API. That works fine! app.module.ts export function…
Anne Lacan
  • 723
  • 1
  • 5
  • 8
13
votes
9 answers

This constructor is not compatible with Angular Dependency Injection because its dependency at index 0 of the parameter list is invalid

In my Angular 9 app, I have an abstract class: export abstract class MyAbstractComponent { constructor( protected readonly cd: ChangeDetectorRef, ) { super(); } // ... } and a Component extending it: @Component({ // ... }) export…
13
votes
1 answer

Angular 6. Is it possible to inject service by condition?

In my angular app (with the angular material) I have a filter panel and I want besides select to be able to make autocomplete (user input value and it sends to the back-end, whereby $regexp query we find the match in MongoDB collection). But to do…
Alex Bryanskiy
  • 295
  • 3
  • 17
11
votes
2 answers

How to inject a service into a constant in angular

I'm trying to export a constant in angular and I need to set a key whose value will be returned from a service. I tried with following code: This is my user-config.ts file: export const USER_CONFIG = { username: new…
Kedar Udupa
  • 392
  • 7
  • 22
10
votes
2 answers

What is the difference between providedIn any and root

In Angular 9 the injectable decorator option providedIn has a new value called any. What is the difference between root and any? Is a service considered a singleton in the case that I use any? @Injectable({providedIn: 'any'}) class UsefulService…
8
votes
4 answers

Angular: Metadata collected contains an error that will be reported at runtime: Lambda not supported

In my Angular app, I'm trying to use a factory provider in my module: export function getMyFactory(): () => Window { return () => window; } @NgModule({ providers: [ { provide: WindowRef, useFactory: getMyFactory() }, ], }) export class…
7
votes
1 answer

Override Angular providers provided in root

I import a modal library of ng-bootstrap in a lazy module. @NgModule({imports: [NgbModalModule]}) This library has a NgbModal service provided in root. @Injectable({providedIn: 'root'}) class NgbModal {...} I inject it into a…
Serginho
  • 6,213
  • 2
  • 21
  • 45
6
votes
6 answers

Angular - Dependency injection through @Input property

Is it a good practice to inject 'service' dependencies in @Input properties? The service in this context is not a singleton instance managed at the root level but multiple instances of different implementations of the interface. Consider the…
6
votes
0 answers

How to set config (or useValue) for imported modules from a component?

We're well aware that there are various ways of setting config for imported modules. We have '.forRoot()', 'useValue', 'useClass' and such to be used in the importing module. Say for example, we want to use ng2-currency-mask. Taking directly from…
5
votes
2 answers

Cannot resolve parameters for ApplicationModule: (?)

Pretty new to Angular. My app contains 1 service and 3 components. Compiled successfully. I'm getting this error and have no idea what went wrong: Uncaught Error: Can't resolve all parameters for ApplicationModule: (?). Debugging gave me very…
4
votes
2 answers

Pass configuration data to a dependency of a angular library using "forRoot"

I've created two Angular libraries, one has the other as a dependency. the dependency needs to be configured using the forRoot method. how can i pass the configuration data from the parent library to it's dependency? for example, let's say we have…
4
votes
1 answer

The semantics of @Injectable(providedIn: 'root')?

Just want to make sure I understand the semantics of @Injectable(providedIn: 'root'). Prior to Angular 6 if we import a module from NPM that contains a service we would declare that module in our app module such that the entire application has…
2
votes
1 answer

Inject query parameter into dependency provider factory in Angular

I want a value from the window.location search parameters passed to the body of a dependency provider factory, ideally in an idiomatic Angular way. Use case: writing my first Angular app I have the app running on one port and the backend server on…
2
votes
1 answer

How to pass attribute Directive instance to nested component using Dependency Injection in Angular

I'm trying to use an attribute Directive to pass an element's template reference from a parent component down to a nested component using dependency injection, but the Directive instance in the parent component that gets a hold of the target element…
2
votes
1 answer

Inject a service from a main project into a created library

I working with Angular 8. This question is only for Angular DI experts. At first, I made an Angular library that will be reused in many project. In this Library, I made an abstract service, that have to be defined in the project using it. I defined…
1
2 3 4 5