template HTML :
<header>
<div>Logo</div>
<nav>
<a href="#">Features</a>
<a href="#">Pricing</a>
<a href="#">Documentation</a>
<a routerLink="/login">Login</a>
</nav>
<div class="header-button">
<button>Login</button>
<button>Get Started</button>
</div>
</header>
<section class="hero">
<h1>La meilleure solution pour <span class="text-gradient">générer</span>
<br>
des devis <span class="text-gradient">personnalisés</span>
</h1>
<h2>Calculez automatiquement le coût de vos prestations en fonction de vos préférences</h2>
<button>Démarrer !</button>
</section>
<main>
<router-outlet></router-outlet>
</main>
composant de route :
// app.routes
import { RouterModule, Routes } from '@angular/router';
import { EstimatorComponent } from './estimator/estimator.component';
import { UserCheckComponent } from './user-check/user-check.component';
import { NgModule } from '@angular/core';
export const routes: Routes = [
{ path: '', redirectTo: '/home', pathMatch: 'full' },
{ path: 'estimator', component: EstimatorComponent },
{ path: 'login', component: UserCheckComponent },
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule {}
mon app config
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
import { provideRouter } from '@angular/router';
import { routes } from './app.routes';
import { provideClientHydration } from '@angular/platform-browser';
export const appConfig: ApplicationConfig = {
providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes), provideClientHydration()]
};
le composant s'affiche dans le template existant, ce que je veux c'est qu'il s'affiche tel une nouvelle page, pour le sign in / log in
Essaye de remplacer routerLink="/login" par href="/login"
Le 13 août 2024 à 12:58:05 :
Essaye de remplacer routerLink="/login" par href="/login"
non ça ne fonctionne pas
je fais des this.router.navigateByUrl(['path'])
Le 16 août 2024 à 14:53:54 :
je fais des this.router.navigateByUrl(['path'])
merci j'essaie