Angular 2 Dependency Injection (DI) Explained

This course will teach you the ins and outs of dependency injection in Angular 2. You will learn what dependency injection means, how it applies to software in general and how it is implemented in Angular 2. We will take a look at simple use cases like injecting services, to exploring different providers recipes and when they are useful. We will also cover almost unknown features like viewProviders, OpaqueToken and edge cases where forwardRef() is needed.

This Angular 2 course assumes knowledge of some fundamentals.
We have an Angular 2 course that will Get you started

Watch User Created Playlist (8)

This playlist is user created.

pro-course-rss-logo

PRO RSS Feed

Understand Angular Dependency Injection

Inject an Angular Service into a Component using Providers

Use Provide and UseClass in Angular Providers

P

Use Angular Factory Providers

P

Use Angular Factory Providers with dependencies

P

Understand Angular @Injectable

P

Use Angular Value Providers

P

Understand OpaqueToken in Angular

P
angular tutorial about Understand Angular Dependency Injection

Understand Angular Dependency Injection

2:36 angular

To get started with Dependency Injection, we first want to understand what it is actually all about. In this lesson, we take a look at Dependency Injection as a software design pattern and clarify why it is so useful that Angular implements a system for it.

angular tutorial about Inject an Angular Service into a Component using Providers

Inject an Angular Service into a Component using Providers

3:07 angular

This lesson explains how we can inject simple service dependencies into Angular 2 components using providers. We’ll also discuss what providers are and why they are needed.

angular tutorial about Use Provide and UseClass in Angular Providers

Use Provide and UseClass in Angular Providers

3:57 angular PRO

In this lesson, we’re going to take a look at how adding the class provide to the providers property of a component to create an actual provider. We’ll learn what a provider specifically does and how we can provide different dependencies with the same token.

angular tutorial about Use Angular Factory Providers

Use Angular Factory Providers

3:29 angular PRO

In this lesson, we discuss how and when to use factory providers, to enable dependencies that shouldn’t be available to Angular’s DI.

angular tutorial about Use Angular Factory Providers with dependencies

Use Angular Factory Providers with dependencies

3:00 angular PRO

This lesson discusses when and how to add dependencies, resolved by Angular’s DI, to factory providers. The example used in this lesson builts upon the previous lesson on understanding factory providers.

angular tutorial about Understand Angular @Injectable

Understand Angular @Injectable

4:27 angular PRO

In order to resolve a dependency, Angular’s DI uses type annotations. To make sure these types are preserved when transpiled to ES5, TypeScript emits metadata. In this lesson we’ll explore how the @Injectable decorator ensures metadata generation for services that have their own dependencies.

angular tutorial about Use Angular Value Providers

Use Angular Value Providers

3:00 angular PRO

Dependecies aren’t always objects created by classes or factory functions. Sometimes, all we really want is inject a simple value, which can be a primitive, or maybe just a configuration object. For these cases, we can use value providers and in this lesson we’ll discuss, how they are created.

angular tutorial about Understand OpaqueToken in Angular

Understand OpaqueToken in Angular

3:53 angular PRO

When using provider string tokens, there’s a chance they collide with other third-party tokens. Angular has with the concept of opaque tokens, that allow us to make whatever token we use unique, so we don’t run into collision problems. In this lesson we’ll explore how they work.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?