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
Evitare (o ridurre) il repo-jacking sulle GitHub Actions
Usare le collection expression per inizializzare una lista di oggetti in C#
Utilizzare l'operatore GroupBy come ultima istruzione di una query LINQ in Entity Framework
Utilizzare i primary constructor in C#
Usare il versioning con i controller di ASP.NET Core Web API
Utilizzare i primary constructor di C# per inizializzare le proprietà
Hosting di componenti WebAssembly in un'applicazione Blazor static
Eseguire una query su SQL Azure tramite un workflow di GitHub
Come EF 8 ha ottimizzato le query che usano il metodo Contains
Creare alias per tipi generici e tuple in C#
Reactive form tipizzati con FormBuilder in Angular
Effettuare lo stream della risposta in ASP.NET Core tramite IAsyncEnumerable