Using the map operator to transform data

When making the API/HTTP calls in a web application, it is often the case that the server doesn’t return the data in a form that is easy to directly render to the UI. We often need some sort of transformation of the data received from the server to map it to something our UI can work with. In this recipe, you’re going to learn how to use the map operator to transform responses from an HTTP call.

Getting ready

The app that we are going to work with resides in start/apps/chapter05/rx-map-operator inside the cloned repository:

1. Open the code repository in your code editor.
2. Open the terminal, navigate to the code repository directory, and run the following command to serve the project:

   npm run serve rx-map-operator
   

   This should open the app in a new browser tab, and you should see the following:

   

   Figure 5.6: The rx-map-operator app running on http://localhost:4200

Now that...