How to Preview Blobs With HTTP POST and Angular 5

With Angular, we can call a web service to get an image as a Blob, convert that to an image and display it on a web page. This may sound like a straight and standard use case but I ended up spending a lot of time trying to get this to work and a lot of asking around. This has been one of the main motivations to write this article.
What I Wanted to Do

To begin with, I am building a website that displays thumbnails retrieved from a URL. On clicking on the thumbnail, the full sized image loads in a new page. Like a typical carousel, but the catch is that the thumbnail is generated dynamically and does not load from or stored on the local machine.