Se connecter

Informatique

Programmation

Sujet : comment naviguer vers une autre page dans angular ?
1
Quality_cloud
Niveau 7
13 août 2024 à 11:06:36

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>
Quality_cloud
Niveau 7
13 août 2024 à 11:07:18

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 {}
  
Quality_cloud
Niveau 7
13 août 2024 à 11:08:37

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()]
};
Quality_cloud
Niveau 7
13 août 2024 à 11:11:05

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

Leboeuf89
Niveau 60
13 août 2024 à 12:58:05

Essaye de remplacer routerLink="/login" par href="/login"

Quality_cloud
Niveau 7
16 août 2024 à 00:09:19

Le 13 août 2024 à 12:58:05 :
Essaye de remplacer routerLink="/login" par href="/login"

non ça ne fonctionne pas

Exkeez
Niveau 9
16 août 2024 à 14:53:54

je fais des this.router.navigateByUrl(['path'])

Joemeek
Niveau 50
19 août 2024 à 16:05:22

Le 16 août 2024 à 14:53:54 :
je fais des this.router.navigateByUrl(['path'])

merci j'essaie

1
Sujet : comment naviguer vers une autre page dans angular ?
   Retour haut de page
Consulter la version web de cette page