Angular è un framework per creare Single Page Application (SPA). Il concetto principale di una SPA è quello di navigazione tra pagine dove la navigazine avviene interamente lato client senza coinvolgere il server. Per fare questo Angular mette a disposizione un sistema di routing molto potente.
Per configurare il sistema di routing, il primo passo consiste nell'importarte il modulo RoutingModule e la classe Routes nella nostra applicazione come mostrato nell'esempio.
import { Routes, RouterModule } from '@angular/router';
A questo punto dobbiamo dichiarare una costante, di tipo Routes, che contiene la lista delle nostre rotte. Una rotta è un oggetto che specifica un url e il component da caricare quando si naviga verso l'url.
const routes: Routes = [ { path: 'company/search', component: CompanySearchComponent }, { path: 'company/detail', component: CompanyDetailComponent }, ];
Il terzo passo consiste nell'importare nel modulo principale della nostra applicazione il RoutingModule e configurarne le rotte tramite il metodo forRoot.
@NgModule({ imports: [RouterModule.forRoot(routes)], ... }) export class AppModule { }
Infine, nel component principale della nostra applicazione dobbiamo inserire il component router-outlet all'interno del quale verrà inserito il codice HTML generato dal component verso cui si è navigato.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Eseguire attività con Azure Container Jobs
Utilizzare Tailwind CSS all'interno di React: installazione
Creare form tipizzati con Angular
Utilizzare la versione generica di EntityTypeConfiguration in Entity Framework Core
Miglioramenti agli screen reader e al contrasto in Angular
Creare alias per tipi generici e tuple in C#
Miglioramenti nelle performance di Angular 16
Eseguire un metodo asincrono dopo il set di una proprietà in Blazor 8
Utilizzare i primary constructor di C# per inizializzare le proprietà
Installare le Web App site extension tramite una pipeline di Azure DevOps
Utilizzare politiche di resiliency con Azure Container App