In my Angular application, I have developed a custom loaderService that displays a loading spinner while the back-end processes requests. Below is the code snippet:
export class ComponentOne {
constructor(loaderService: LoaderService, orderService: OrderService) {}
...
...
method() {
this.loaderService.display(true);
this.orderService.firstRequest()
// the misspelled word causes a 500 error
.then((response) => this.orderService.methodWithWrongInput('misspelled_word'))
// but it still executes the following then
.then(() => this.method2())
.catch(() => null)
.then(() => this.loaderService.display(false));
}
...
}
Even though I display the spinner before the request, I make sure to close it regardless of the success or failure of the request by using catch and a final then. While debugging, I noticed that despite the second request failing due to the misspelled word, method2() is still being invoked. Or is it really failing?
I am curious about how the catch method operates when chaining requests. I presumed that if a request fails, we would directly jump to the catch method, but I may be mistaken.
Edit: Upon further investigation, I discovered that my assumption about method2() being executed was incorrect. For more details, refer to T.J. Crowder's response.