Subscription after switchMap does not work

Question

I have created a Confirmation dialog that returns true or false, based on the user's choice.

This is the function that opens the dialog and handles the responses:

public action(id: number): void {
    this.dialogService.openDialog(ConfirmationComponent).afterClosed()
        .pipe(
            switchMap(
                (result: boolean) => {
                    if (result) {
                        return this.service.doSomething(id);
                    } else {
                        return of('cancelled');
                    }
                }
            )
        ).subscribe({
            next: (response: string) => {
                this.snackBarService.openSnackBar(response, 'valid');
            },
            error: (error: HttpErrorResponse) => {
                this.httpService.handleError(error);
            },
            complete: () => {
                this.getData();
            }
        }
    );
}

When the dialog returns false, the snack-bar opens with the message cancelled (as expected) and the getData() function gets executed. However, when the dialog returns true, the doSomething(id) function gets executed (as expected), but the snack-bar does not show up, and getData() is not executed.

Does anybody have any idea why it's behaving like that? I can't figure it out.

Answer 1

This really depends on what this.service.doSomething(id) returns. I suppose it's an Observable but based on your description it never emits any next and no complete. It might return an empty Observable such as EMPTY or just new Observable().

So the solution here is to make sure that this.service.doSomething(id); emits and completes.