Dependence injection is not a new concept.

A lot of frameworks take advantage of this common design pattern.

Imagine I were writing a book.

I've read enough books to know, that a book needs a cover and some pages.

If I weren't using dependency injection, my code would be very rigid.

The pages were created at a paper mill.

The paper was created from trees.

And the trees need water and sunshine to grow.

Rather than the book knowing its origin, and how to reproduce itself.

The factory assembles the book.

Dependency Injection is like a factory,

kindly creating services where we need them.

In an Angular application,

dependency injection creates a singleton of a given service.

This comes in handy when you have multiple areas of your application,

that need to communicate with each other.

To demonstrate how dependency injection works in our application.

We're going to set up the HttpModule, to retrieve entries from the server.

Go ahead and set up your dev server now, if you're not already up and running.

Now, open up the entry-List.component.cs file.

Before we can start using dependency injection on this component,

we need to add a constructor function.

Angular uses the constructor function, to instantiate the components and

wire up our dependencies.

Next, we need to import the Http service.

The Http service, is an interface for sending and

receiving data from a backend server.

When we were adding the Http module to our Ng module configuration in the last video.

We made this Http service available throughout our application.

Notice we're importing Http the service, not Http the module.

Now we'll assign the Http service as a perimeter in the constructor function.

Be sure to define the type as the imported Http service.

Inside the constructor function,

we can test out the Http service to make sure it's working.

We'll add a new line and at the start type Http.

As I type, intelligence is helping guide me,

to what methods are available on this service.

I'm going to choose get.

The methods on the Http service returns an observable.

I won't be covering up observables in this course.

To find out more information about observables, check the teacher's notes.

Let's convert this into promise.

We can do this by appending the toPromise function.

Then, we can chain the then method with a success.

And a failure callback.

I've just debugger statements in here for now.

Save the file and head back over to the browser.

The debugger break point has been hit.

The request returned a four row fault,

which means we currently don't have the back end server.

We'll tackle this problem a little later on in the course.

To see what dependency injection is really doing for

us, right click on the Http definition.

And click Go to Definition.

The Http service,

has a set of dependencies as defined in the constructor.

The consumer of this service, because of dependency injection isn't concerned

about these dependencies, because Angular will provide them for us.

Our entry list component only needs to specify what it needs.

The Http service.

Then the Dependency Injection system can handle the rest.

Dependency Injection is pretty cool.

In the next video, we'll make good use of our Http service.

See you there.