Quando definiamo il routing di un'applicazione Angular, generalmente per ogni route specifichiamo l'url e il component che deve rispondere all'url. Oltre a queste informazioni, possiamo specificarne anche altre tra cui un oggetto custom che può contenere qualunque proprietà e che viene passato in input al component quando viene caricato dalla navigazione.
Il primo step per eseguire questa operazione consiste nel valorizzare la proprietà data durante la specifiche del routing come mostrato in questo esempio.
const routes: Routes = [ { path: '', component: HomeComponent, data: { title: 'titolo' } }, ];
Il secondo step consiste nell'iniettare il servizio ActivatedRoute nel costruttore del component e sfruttarne la proprietà data per accedere all'oggetto impostato nel routing. Questa proprietà non torna l'oggetto, bensì un observable che torna l'oggetto quindi dobbiamo usare il metodo subscribe per recuperare i dati.
export class HomeComponent implements OnInit { title: string; constructor(private route: ActivatedRoute) {} ngOnInit() { this.sessionId = this.route .data .subscribe(d => this.title = d.title); } }
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Creare moduli CSS in React
Aggiungere interattività lato server in Blazor 8
Esportare ed analizzare le issue di GitHub con la CLI e GraphQL
Miglioramenti nell'accessibilità con Angular CDK
Usare le variabili per personalizzare gli stili CSS
Gestire i null nelle reactive form tipizzate di Angular
Elencare le container images installate in un cluster di Kubernetes
Hosting di componenti WebAssembly in un'applicazione Blazor static
Gestire liste di tipi semplici con Entity Framework Core
Effettuare lo stream della risposta in ASP.NET Core tramite IAsyncEnumerable
Creare gruppi di client per Event Grid MQTT
Utilizzare la session affinity con Azure Container Apps