Loading Data

Angular and HTTP methods

Angular’s HttpClient service allows developers to perform asynchronous requests using the following methods (all of which return an Observable):

• The request method accepts any type of HTTP method, like, GET, POST, and so on.
• The get method retrieves any information identified by the URI.
• The post method is usually used to create a new resource, like posting data to be added to a remote database.
• The put method is most often used to update existing resources, like posting data to update a current record in a remote database.
• The delete method is generally used to remove an existing resource, such as removing a remote database record.
• The patch method is used to make changes to a resource, not the complete resource itself.
• The head method is identical to the HTTP GET method except the server must not return a message-body in the response.
• The options method requests information about available communication options when communicating with a specific resource.

The more seasoned developers will undoubtedly have noticed that these Angular methods are named exactly the same as the HTTP protocol methods themselves.

This is no accident, as it makes sense to identify the purpose of each method by its associated HTTP counterpart. When working with RESTful services, this is especially important.

We will typically be working with just the get and post methods in our apps, so let’s start with how to retrieve data and import that for use.

Importing data

Using the get method of the Angular HttpClient service, we might asynchronously request a resource and parse the retrieved data in the following manner: