Negli script #201 e #202 abbiamo visto come passare uno o più parametri a un component durante la fase di navigazione. In questo script vedremo come recuperare questi parametri nel component verso cui navighiamo.
La classe responsabile della lettura dei parametri è ActivatedRoute (contenuta nel modulo @angular/router). Questa classe deve essere iniettata nel component tramite il costruttore e ne va utilizzata la proprietà params che è un observable al quale viene inviato un oggetto con tutti i parametri della pagina. Il prossimo esempio mostra il codice necessario per recuperare un parametro id.
import { ActivatedRoute } from '@angular/router'; @Component({ templateUrl: 'detail.html', }) export class DetailComponent implements OnInit { constructor(private activatedRoute: ActivatedRoute) { } ngOnInit() { this.activatedRoute.params.subscribe(p => { this.id = p['id']; }); } }
Il motivo per cui i parametri vengono inviati tramite un observable è che se da un component decidiamo di navigare verso lo stesso component ma con parametri diversi, Angular non scarica e ricarica il component, ma lo mantiene vivo e invia semplicemente il nuovo parametro all'observable. Sarà compito del nostro codice ricaricare i dati della pagina al variare dei parametri.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Configurare lo startup di applicazioni server e client con .NET Aspire
Cancellare una run di un workflow di GitHub
La gestione della riconnessione al server di Blazor in .NET 9
Gestione file Javascript in Blazor con .NET 9
Rinnovare il token di una GitHub App durante l'esecuzione di un workflow
Applicare un filtro per recuperare alcune issue di GitHub
Scrivere selettori CSS più semplici ed efficienti con :is()
Gestire la cancellazione di una richiesta in streaming da Blazor
Utilizzare Locust con Azure Load Testing
Rendere i propri workflow e le GitHub Action utilizzate più sicure
Inference di dati strutturati da testo con Semantic Kernel e ASP.NET Core Web API
Utilizzare l'espressione if inline in una pipeline di Azure DevOps