From the course: Angular: API Communication and Authentication

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Refactoring HTTP calls to use the API service

Refactoring HTTP calls to use the API service - Angular Tutorial

From the course: Angular: API Communication and Authentication

Start my 1-month free trial

Refactoring HTTP calls to use the API service

- [Instructor] Now that we have our api service ready to go, we need to inject this service into our component. Let's head over to our contact-list component. In this component, we first import the api service we just implemented. Then, instead of injecting the HTTP service, we inject our api service. Let's call this api and it's type will be ApiService. We no longer need the HTTP imports or the rxjs operator. In the ngOnInit method we place the current code with a call to the get method on the api service. Let's test things out using npm run watch. And, it looks like we got a quick error. We are trying to make a call to api//api. Looks like we have the URL wrong. Remember that we have the base URL already set in the api service. So, this willl simply be contacts. And, great, we see our contacts are now being rendered. If we refresh, hit the XHR button, we can see that we're making a call to the correct api. Next, let's head over to the add-contact component. We will also no longer…

Contents