Quick Look – Angular HTTP Calls

In my previous post, we focused on binding some data in the UI to data being returned from our ContactsService. In this post, we are going to make this a little more real and modify that service to call an ASP.NET Core backend.

For starters, let’s write a quick ASP.NET Core backend that will handle our three methods supported by our ContactsService. We need to support all, find, and save.

Since this post isn’t really about ASP.NET Core, we are going to skip over the C# part of this, but below are the methods we would implement in our ASP.NET controller.

The Angular code to call this is pretty straightforward. We are going to need to use Angular’s HttpClientModule and then import the router into the app.module.ts file in our Angular project.

After importing HttpClientModule, we need to use the HttpClient in our service. Since we already have a working service, converting this to call our backend should be pretty straightforward. We’ll use the http.post method on our HttpClient.

Angular is great because it is a comprehensive framework. It solves most of the problems you will run into (including making HTTP calls) when writing an SPA.