1
resposta

Observables (vazamento de memória)

Bom dia

Sabendo-se que é uma boa prática adotar o Pipe Async em templates que dependem de Services e que consultam o back-end retornando uma Observable, para que assim não haja a necessidade de se preocupar em se "desinscrever" da mesma. Exemplo:

// component
export class DetalheAnimalComponent implements OnInit {
  animal$!: Observable<Animal>;

  // Demais trecho de código para a chamada do service
  ...
}
// template
<div class="bg-white border" *ngIf="animal$ | async as animal">

Levando em conta a premissa acima, para situações que será necessário se inscrever explicitamente em uma Observable (conforme diversos exemplos abaixo), há alguma forma ou abordagem recomendada para se "desinscrever" da Observable?, como um "ngOnDestroy"

 curtir() {
    this.animaisService.curtir(this.animalId).**subscribe**((curtida) => {
      if (curtida) {
        this.animal$ = this.animaisService.buscaPorID(this.animalId);
      }
    });
  }
  excluir() {
    this.animaisService.excluiAnimal(this.animalId).**subscribe**(
      () => {
        this.router.navigate(['/animais/']);
      },
      (error) => console.log(error)
    );
  }
  cadastrar() {
    if (this.novoUsuarioForm.valid) {
      const novoUsuario = this.novoUsuarioForm.getRawValue() as NovoUsuario;
      this.novoUsuarioService.cadastraNovoUsuario(novoUsuario).**subscribe**(
        () => {
          this.router.navigate(['']);
        },
        (error) => {
          console.log(error);
        }
      );
    }
  }

Obrigado.

1 resposta

Olá, Felipe! Tudo bem?

Você pode usar o Subscription do rxjs (import { Subscription } from "rxjs/Subscription"):

import { Subscription } from "rxjs/Subscription";

// ...

subManager = new Subscription();

ngOnInit() {
  const subscription = this.exemploService.subscribe(() => {});
  this.subManager.add(subscription);
}

ngOnDestroy() {
  this.subManager.unsubscribe();
}

Fontes:

Bons estudos!