Angular dependency injection in depth – Dependency providers (2021)

✂️Use coupon YOUTUBE_DISCOUNT to get a 10%-off discount

Hello guys! Let's continue to talk about in-depth topics of #Angular dependency injection. Today I would like to show you dependency providers like useClass, useExistiong, useValue, and use factory. Likewise, resolution modifiers control how Angular resolves dependency - dependency providers responsible for how Angular should create dependency instances. It allows you to replace different service implementations in runtime which makes your application extremely powerful and flexible. I hope you find I lot of use-cases in your applications. Thank you for your attention and enjoy watching! 😉

Angular Dependency Injection – Understanding hierarchical injectors (2020)

Angular Dependency Injection in Depth - Resolution modifiers (2020)

🕒 Time codes:
00:00:00 - Intro
00:01:00 - Quick recap of how we provide dependencies
00:01:18 - Describing the problem
00:03:14 - useClass in Action
00:05:46 - useExisting in Action
00:07:44 - useValue in Action
00:09:06 - A little bit about InjectionToken()
00:12:26 - useFactory in Action
00:15:11 - useValue vs useFactory. What's the difference?
00:16:24 - multi:true announcement
00:16:43 - Outro

------------------- See my another videos about Angular -------------------

✅ Check out my video "My TOP 5 Angular Interview Questions"

✅ Check out my videos about Angular Material Library:

✅ Check out my videos about Angular CDK:

🔗 Links:
More about Dependency Injection:

#angulartutorial #webdevelopment #dependencyinjection

[DecodedFrontend]

Dear developers! Thank you for watching my videos. I hope you will find it useful and I appreciate any feedback from you in comments. Have a productive week 😉

P.s IMPORTANT!!! @Alex Malkevich suggested in comments a very nice approach which allow you to make your useFactory even more flexible. Instead to provide all dependencies in deps: [...] you can provide just Injector and get dependencies via Using this approach you should not care any more if your factory function will get new dependency or if dependency order will be changed.
The pseudo-code would look like this:
{
useFactory: (injector: Injector) => ? ... : ...,
deps: [Injector]
}
Thanks for suggestion, Alex!

[mikojanchannel]

12:25 "I hope that it is clear now"
I wish it was clear, it's complicated, I am still learning it.

[UIGems]

Great video! Dislikes are from Angular documentation team 😁

[saulo]

That's really good, mate! Saved me from a lot of trouble. Unfortunatelly the Angular documentation does not have as many examples as here, but now I think I have a solid grasp on that topic!

[rikisyahputra]

I don't know why angular DI is so much easier to understand when watching this rather than reading the docs

[yuriiilnytskyi]

Dude, you did a really great job. I was aware about these features of Angular DI but also, I was always a bit struggling with deep understanding how does it work under the hood. Now I'm happy that I do :) Thank you man!

[danieldouglas]

Very well explained and it's good to see some real world examples of usage which is something a lot of videos lack.

[SouravDuttaROCKSTAR]

This could be really useful to extend an existing project let's say a codebase developed for one country can be used by other teams to accommodate changes for other countries based on the useFactory concept ... Gonna use this approach, just awesome :D

[leonardopeixoto]

Great class, thanks for making it ! One smal correction, tho - on 5:55 you say that useClass has this "feature" of creating new instance, suggesting that regular methods of providing doesnt create new instances. But I just did a small experiment - when Loggerservice is provided in providedIn clause in itself and on providers clause of component, each one of those create new instances of LoggerService. I tested it creating an Input to pass the external logger, and compared it with the logger provided in the "providers" clause of the component itself - result different. Did a test incrementing a count property in the LoggerService to compare, and confirmed - they were two independent instances.

[umakantlakhawar]

Thanks you so much for explaining DI in Angular in simple words. I have watched all your videos on Dependency Injection, very nicely explained . I want to memorize/revise these concepts quickly within few minutes, so could you please provide the source code for the same.

[lhargil]

This was well-explained. Thank you very much. :)

[rajanjoseph]

Wow! It's really useful to me! Thanks a lot 👍

[nasheedstation]

Awesome Awesom Awesome Video! Very detailed explanation! Thanks! :)

[dmitriy]

Wow thanks. That was useful especially useFunction part

[Don-slny]

Hello
What is the practical use case of useclass provider.

[joshblf]

It would be cool if you went in depth on tree-shakable providers. You mentioned them a few times but didn't really go into it.

[johnadaikalasamy]

great video, well explained. Thank you very much :)

[pavelsokolov]

Could you please provide more cases where it can be useful except of the experimental mode?

[rs]

Thanks I've learned something new 🎉

[chrisfelix]

All your videos are better than the Angular Docs