Tengo un problema interesante cuando uso rutas secundarias en Angular. La ruta solo funciona cuando hay una redirección a una ruta "no operativa".

En mi navegador, si escribo localhost:4200/customer/add/, obtengo un error 404 Not Found.

Pero si escribo localhost:4200/cliente (esta ruta se redirige a cliente/agregar) la página funciona.

Mi módulo de enrutamiento:

 import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { Routes, RouterModule } from '@angular/router'; import { AuthenticationLayoutComponent } from '../../components/authentication-layout/authentication-layout.component'; import { LoginComponent } from 'src/app/components/authentication/login/login.component'; import { AddCustomerComponent } from 'src/app/components/customer/add-customer/add-customer.component'; import { RegisterComponent } from 'src/app/components/authentication/register/register.component'; import { MasterLayoutComponent } from 'src/app/components/master-layout/master-layout.component'; const routes: Routes = [ { path: 'customer', component: MasterLayoutComponent, children: [ { path: "", redirectTo: 'add',pathMatch: 'full' }, { path: "add", component: AddCustomerComponent}, ], }, { path: '', component: AuthenticationLayoutComponent, children: [ { path: 'login', component: LoginComponent }, { path: 'register', component: RegisterComponent }, ], }, ]; @NgModule({ declarations: [], providers: [], imports: [ CommonModule, RouterModule.forRoot(routes, { enableTracing: false }), ], exports: [RouterModule], }) export class AppRoutingModule {}