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.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Ottimizzare la latenza in Blazor 8 tramite InteractiveAuto render mode
Specificare il versioning nel path degli URL in ASP.NET Web API
Gestire i null nelle reactive form tipizzate di Angular
Utilizzare database e servizi con gli add-on di Container App
Aggiungere interattività lato server in Blazor 8
Determinare lo stato di un pod in Kubernetes
Miglioramenti agli screen reader e al contrasto in Angular
Utilizzare Model as a Service su Microsoft Azure
Eseguire le GitHub Actions offline
Sfruttare lo streaming di una chiamata Http da Blazor
Effettuare delete massive con Entity Framework Core 7
Eseguire attività basate su eventi con Azure Container Jobs