Applying Dependency Injection

In this chapter, you will learn about Angular Dependency Injection. Dependency Injection is one of the most striking features in Angular; it allows us to create injectables that can be used as shared resources between various components.

In this chapter, we will discuss the following:

• Exploring Dependency Injection
• Learning about provider classes in detail
• Understanding hierarchical Dependency Injection
• Creating an Injectable
• Learning to inject providers into services
• Learning to inject providers inside the components
• Learning to resolve dependencies for a provider class
• Creating examples using the @Inject, provide, and useValue decorators

Applications without Dependency Injection

Without the Dependency Injection framework, the life of a developer would be very tough. Take a look at the following drawbacks of not using Dependency Injection:

• Every time a constructor parameter needs to be passed, we will need to edit the constructor definition of the class in all instances

• We will need to create constructors and inject each of the required dependency classes individually

Let's take a look at an application without Dependency Injection to understand the challenges and shortfalls:

class products {
 available;
 category;
 
 constructor() {
  this.available = new warehouse();
  this.category = new category();
 }
}

Let's analyze the preceding code snippet to understand better:

1. We created a class named products.
2. In the constructor method, we instantiated the dependent classes, warehouse and category.
3. Note that...

Dependency Injection - Introduction

Dependency Injection(DI) is a coding pattern in which a class receives dependencies rather than creating them itself. Some developers and technology mavericks also refer to this as a design pattern.

It's widely used and is often called DI. We will refer to the Dependency Injection system as DI in all our sections.

Here's why we absolutely need DI:

• DI is a software design pattern in which a class receives its dependencies rather than creating the object itself
• DI creates and delivers objects, which are required dynamically just-in-time
• We can consider the injectables as our application's reusable repository
• DI allows independent development of dependency modules for remote development teams.

No Angular apps can be completely written without using DI.

Now, let's revisit the preceding code we wrote without DI and write it...

Registering providers

An injector creates dependencies using providers. Providers are required to be registered into the consuming services or components. By registering them, the provider class allows us to create independent reusable features and functionalities by individual team members.

Configuring and registering provider classes also allows to break down functionalities into smaller modules, which are easy to maintain and modify. We can register provider classes into services and components in different ways. Important points to always keep in mind about injectors are as follows:

• We have to create a provider in our NgModule, component constructor, or in a directive
• Register the service in the component's constructor

We have created a ListService service in the preceding section, which has a method and can now be registered and used in multiple components:

Let&apos...

Summary

In this chapter, we discussed Angular DI as we know it now. DI allows us to inject the provider class and injectables into components using providers. We learned and implemented provider classes and hierarchical Dependency Injection. We also learned to register providers in the NgModule or inside components directly.

We focused on how to create and configure Injectors and also how to register services in providers inside the component decorator.

This chapter explained that a provider class can also have dependencies, which internally can be injected again into services or components. In the next chapter, you will learn about Angular animations. Angular animations is a core library that provides a better user experience by applying motions and transitions to apps.

We will learn about various transitions and motions, and how to style animations; above all, we will create...