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
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Creazione di plugin per Tailwind CSS: espandere le Funzionalità del Framework
.NET Conference Italia 2023
Cambiare la chiave di partizionamento di Azure Cosmos DB
Eseguire query manipolando le liste contenute in un oggetto mappato verso una colonna JSON
Utilizzare politiche di resiliency con Azure Container App
Hosting di componenti WebAssembly in un'applicazione Blazor static
Implementare il throttling in ASP.NET Core
Eseguire operazioni con timeout in React
Utilizzare Model as a Service su Microsoft Azure
Short-circuiting della Pipeline in ASP.NET Core
Assegnare un valore di default a un parametro di una lambda in C#
I più letti di oggi
- Ottimizzare le performance delle collection con le classi FrozenSet e FrozenDictionary
- ASP.NET 3.5 per tutti
- .NET Conference Italia 2023 - Milano e Online
- Sblocca le performance della tua applicazione con .NET 8
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!