In this lesson, we’ll explore dependency injection in Angular: we’ll discuss injection tokens, how to provide services at different levels, and the decorators that tell Angular how to resolve dependencies.

Dependency injection in Angular is one of its core principles. It is a design pattern that allows you to use entities (such as services, pipes, and others) across the entire application. For example, in our app, the Users component works together with a dependency — the Users service. In other words, the Users service is injected into the Users component.

By default, services are available throughout the entire application (they are singletons). This is defined by the providedIn: ‘root’ property in the @Injectable decorator. However, services (and other entities) can also be provided at the module or component level (these are different injector levels in Angular). Angular resolves dependencies hierarchically, from the local injector (component) up to the root injector. You can control this resolution process using special decorators, which we will also cover in this video (@Self, @SkipSelf, @Optional).

In Angular, developers can create and use their own custom tokens. In this lesson, we will create a token for injecting a base URL for API requests.