How to cancel an ongoing http call resolve or reject onDestroy of angular component

I have a function that does a HTTP post on click of a Submit button. Based on the response I will display a modal saying the request was success or not.

Now the problem arises when the user clicks on the Submit button and immediately clicks on a navigation icon that will load a different component. Now the other page is loaded but still the HTTP request is processed and resolve/reject is called and the modal backdrop fade is displayed which grays out the whole screen and does not allow the user to do anything else. The only way out is to refresh the screen.

Is there a way I can stop executing the resolve / reject onDestroy of the component?

Source: New feed
Source Url How to cancel an ongoing http call resolve or reject onDestroy of angular component