Uno degli aspetti più verbosi dello sviluppo di una applicazione Angular è ricordarsi di eseguire l'unsubscribe delle subscription alla dismissione del componente. Nello script #284 abbiamo visto come eliminare le sottoscrizioni utilizzando la libreria subsink. In questo script risolveremo il problema usando una tecnica diversa.

Quando dobbiamo cancellare le subscription, la pipe async ci porta un grande aiuto, eseguendo il lavoro per noi, ma non tutto il codice eseguito può essere sottoscritto nel template HTML. Ad esempio le operazioni di creazione, aggiornamento e rimozione sono sottoscrizioni eseguite nel codice del component dopo un'interazione dell'utente. Per riuscire a gestire queste sottoscrizioni dobbiamo creare una variabile di tipo Subscription, a questa aggiungere tutte le sottoscrizioni create, e nel metodo ngOnDestroy disporle. E' già troppo noioso e laborioso anche solo leggerlo vero?

Grazie alla libreria ngx-take-until-destroy l'unsubscribe potrà essere eseguito in maniera automatica, al momento della distruzione del componente, dichiarandone l'intenzione all'interno della pipe.

Per l'installazione occorrerà eseguire lo script

npm i ngx-take-until-destroy --save

Per l'utilizzo basterà aggiungere alla pipe della subscription l'operatore fornito dalla libreria.

myLongSubscription()
  .pipe(
    tap(x=>console.log),
    untilDestroyed(this))
  .subscribe();

Nel component poi dobbiamo implementare l'interfaccia OnDestroy dato che la funzionalità appena inserita utilizza l'operatore RxJS takeUntil legandolo alla chiamata della metodo ngOnDestroy.