Action when finalizing the request at the angle

Asked

Viewed 50 times

0

I have a loading that is activated at the beginning of my request and I need to stop it at the end of the request.

I tried something like:

  onSubmit() {
    this.submitted = true;

    if (this.loginForm.invalid) {
      return;
    }

    this.loading = true;
    this.authenticationService.login(this.f.username.value, this.f.password.value)
        .pipe(first())
        .subscribe(data => {
          this.router.navigate([this.returnUrl]);
        },
        error => {throw error},
        () => {this.loading = false}
      )
  }

The loading is not stopping. I remember I had a third subscribe parameter that occurs when the request ends, but I’m not able to implement it.

angular
  • 1

    If you add a console.log in this third function, it will be executed?

  • complete parameter

  • @Andersoncarloswoss does not perform...

  • 1

    Depending on where your source comes from subscribe doesn’t die, it keeps perpetuating expecting new updates. Example: in a request via API it returns the data in the next and then dies then sending a complete, If you sign an internal status change from your application and don’t fire a complete one by it, your subscribe will always be listening a next, in this case you could terminate the loading within the next.

  • I got it with a rxjs operator, I put the answer if anyone needs it

  • 1

    In your case, as the next is omitted, it is being processed when you receive your object data, just clearing up.

  • @Leonardo thanks for the clarifications

Show 2 more comments

1 answer

2


I got it from the operator finalize of rxjs:

import { finalize } from 'rxjs/operators';

At the end my job was like this:

  onSubmit() {
    this.submitted = true;
    // stop here if form is invalid
    if (this.registrarForm.invalid) {
      return;
    }
    this.loading = true
    this.authenticationService.registrar(this.registrarForm.value)
      .pipe(
        finalize(() => this.loading = false)
      )
      .subscribe((res) => {
        if(res !== ""){ //Cadastrou com sucesso então pode pegar token e encaminhar para tela de login
          this.getTokenAdministrador()
        }
      }
    )
  }

Browser other questions tagged angular

You are not signed in. Login or sign up in order to post.