0

tengo un problema que no encuentro la solución. Tengo una página que se encarga de renderizar distintas rutas en angular. Cuando inicio mi aplicación la primer vista que se carga es la de login, el problema surge cuando quiero ingresar a otras rutas directamente por su nombre ya que estas no me aparecen y siempre me redireccionan al login, ¿Podrían indicarme sobre que puedo estar haciendo mal?. La idea sería poder poner localhost:4200/validate-code y que se cargue la pagina, pero no funciona. De antemano muchas gracias.

app-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ForgotPasswordComponent } from './components/auth/forgot-password/forgot-password.component';
import { LoginComponent } from './components/auth/login/login.component'
import { ResetPasswordComponent } from './components/auth/reset-password/reset-password.component';
import { ValidateCodeComponent } from './components/auth/validate-code/validate-code.component';


const dashboardModule = () => import('./components/dashboard/dashboard.module').then(x => x.DashboardModule);

const routes: Routes = [
  //{ path: '', component: LoginComponent},
  { path: 'login', component: LoginComponent,},
  { path: 'validate-code', component: ValidateCodeComponent},
  { path: 'forgot-password', component: ForgotPasswordComponent},
  { path: 'reset-password/:_id', component: ResetPasswordComponent },
  { path: 'dashboard', loadChildren: dashboardModule },
  { path: '**', redirectTo: ''},

];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule],
})
export class AppRoutingModule {}

export const routingComponents = [
  LoginComponent,
  ValidateCodeComponent, 
  ForgotPasswordComponent, 
  ResetPasswordComponent
]

app-module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule, routingComponents } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ReactiveFormsModule } from '@angular/forms';

//Componentes
import { SharedModule } from './components/shared/shared.module';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { TokenInterceptor } from './shared/interceptors/token.interceptor';
import { ErrorInterceptor } from './shared/interceptors/error.interceptor';


@NgModule({
  declarations: [
    AppComponent,
    routingComponents
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    ReactiveFormsModule,
    SharedModule,
  ],
  providers: [
   { provide: HTTP_INTERCEPTORS, useClass: TokenInterceptor, multi: true },
   //{ provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

app-component.html

<body>
    <router-outlet></router-outlet> 
</body>
2
  • Que error te da la consola cuando intentas navegar?
    – ayaleil
    el 10 jun. 2022 a las 19:23
  • Ese es el problema, no me da ningún tipo de error, solamente no me deja abrir ventanas nuevas porque las redirecciona automáticamente a login el 14 jun. 2022 a las 1:01

1 respuesta 1

0

Prueba esto:

    const routes: Routes = [
      {
        path: '',
        pathMatch: 'full',
        redirectTo: 'login',
      },
      { path: 'login', component: LoginComponent},
      { path: 'validate-code', component: ValidateCodeComponent},
      { path: 'forgot-password', component: ForgotPasswordComponent},
      { path: 'reset-password/:_id', component: ResetPasswordComponent },
      { path: 'dashboard', loadChildren: dashboardModule },
      { path: '**', component: LoginComponent},
    ];

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.