Providers and Dependency Injection

To understand the role of providers in the dependency injection of services, let’s look at the following example:

constructor(childService: ChildService) {
  logger.logInfo('Creating HeroBiosComponent');
}

In this case, Angular asks for the injector associated with the service and assigns the returned value to the childService parameter.

In case the injector is not able to find the associated token, it goes to ask the parent injector for the same, and the process repeats until an injector is found.

The way different providers are defined are:

 providers: [
    { provide: Hero, useValue: someHero },
    { provide: TITLE, useValue: 'Hero of the 
      Month' },
    { provide: HeroService, useClass: 
      HeroService },
    { provide: LoggerService, useClass: 
      DateLoggerService },
    {

...