Summary of DI providers in angular with example

A provider is an instruction to the DI system on how to obtain a value for a dependency. It is the provider that determines which instance or value should be injected at the runtime in components, pipes, or directives. Various types of provider are involved in angular DI, so to understand the purpose of provider types please visit our video tutorial All Providers Summary With Example | Angular | Tutorial

This tutorial summarizes entire Dependency Injection (DI) provider’s usage through fun exercise, also known as Jack & Jill restroom example. Suppose Jack and Jill two people want to set up their home. They have their personal preferences on few household things and few things they want to share. Both have some individual household stuff like tables, fans, tube lights etc. and have shared restroom. Now we will see how we can fulfill their household stuff requirements considering different types of angular DI providers, like where we should use which kind of provider in app development (home setup).

At the end of this exercise we will be capable of identifying in which scenario which provider type is suitable. Like here as Jack & Jill both need independent fan, so we should use UseClass provider in both Jack & Jill components (rooms). Similarly for shared restroom, we can use UseExisting provider type by defining it in Appmodule (entire Home) with two different interfaces (doors).

Similarly we have explained usage of other provider types through this Jack n Jill restroom example in our video. Snapshot from video session below: