NgxSpinner hide function is not hiding

Question

I've been using them NgxSpinner in my projects recently, and I've been facing this strange behaviour on the spinner.hide(). I want to make this function happen in the subscribe complete function, because you know? Thats the perfect spot for it... The spinner will only hide when there's any kind of response from the API...

Example of what I'm talking about:

this.spinner.show();
    this.authService.login(this.formLogin.value).subscribe({
      next: (token) => {
        console.log(token);
        StorageUtil.login(token.token, token.refreshToken);
      },
      error: (error) => this.showError(),
      complete: () => {
        console.log('Bateu here');
        this.spinner.hide();
      },
    });

But everytime I try to do so, the spinner opens, but it never closes... I know about the setTimeout function... but thats totally nonsense right?

setTimeout(() => {
      this.spinner.hide();
    }, 2000);

Am I doing something wrong...

Answer 1

I use this in my project and it work well

    ngOnInit(): void {
        this.spinner.show().then();
        this.coursService.getCoursOfMySchool(user.school.idSchool).subscribe(value => {
            this.courses = value
            this.spinner.hide().then()
          });

  }

Answer 2

This can only happen when 'login' method defined inside 'authService' Class is not returning any Observable. Because there is no other reasoning why complete method of a subscription does not run. The complete method will run even if there are any errors while interacting with the API(s).

Please check/confirm the following :

1.Are you seeing console messages defined inside next and complete section of the Subscription? 2 Does login method return any Observable? Something like the following screen shot :

 return this.httpClient.post('API_END_POINT_URL',requestBody,httpOptions);

Let me know what you will find and please provide your feedback accordingly and upvote this answer accordingly so that it will help others as well.