Loading indicator shown even when calls to API result in an error

[zachberger]

Currently when the API errors out the loading indicator continues to be shown. It would be nice if the user got a friendly error message when the API is down.

[housseindjirdeh]

Good call, it doesn't make sense to keep showing the loading indicators instead of a simple error message.

[bfan1256]

Just a question, what code are you checking on whether or not there is data from the cache and whether or not you are receiving data from an api? I'm sorry, I'm new to all of this pwa stuff and just wasn't sure on how you implemented this check.
Thanks and great tutorial!

[housseindjirdeh]

@bfan1256 not at all! Please don't ever hesitate to ask questions. I'm glad you found my tutorial useful :)

So I specify a local errorMessage string in each of my main components. When I subscribe to the Observable responsible for returning data, I specify on the onError method to populate the errorMessage with a string.

Now in my template for the component, I use ngIf to show the loading indicator when there is no item and the error message field is blank. This scenario only passes if the request is still fetching. Similarly, I show the actual content only if the item object is populated.