You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Angular路由报错NG04002:导航至customer/detail路径失败求助

Angular路由导航报错NG04002 noMatchError

尝试导航到指定路径时触发错误:ERROR Error: Uncaught (in promise): Error: NG04002 noMatchError

我用两种方式尝试导航到customer/detail路由,但均触发相同错误:

  • HTML中点击带有routerLink="customer/detail/"的按钮
  • 调用方法this.router.navigate(['customer/detail', data.Id])

以下是我的路由配置代码:

CustomerRoutingModule

export const customersRoutes: Routes = [
    {
        path: '',
        component: CustomerListComponent,
        children: [
            {
                path: 'detail/:ID',
                component: CustomerDetailComponent,
            }
        ]
    }
];

@NgModule({
    imports: [RouterModule.forChild(customersRoutes)],
    exports: [RouterModule]
})

export class CustomerRoutingModule { }

CustomerModule

@NgModule({
  imports: [
    BrowserModule,
    ReactiveFormsModule,
    FormsModule,
    CommonModule,
    NgxDatatableModule,
    CustomerRoutingModule
  ],
  declarations: [CustomerDetailComponent, CustomerListComponent]
})
export class CustomersModule { }

AppRoutingModule

export const AppRoutes: Routes = [
  {
    path: '',
    redirectTo: 'customer',
  },
  {
    path: 'login',
    component: LoginComponent
  },
  {
    path: '',
    component: AdminLayoutComponent,
    children: [
      { path: 'customer', loadChildren: () => import('./pages/customers/customers.module').then(m => m.CustomersModule) },
      { path: 'dashboard', component: DashboardComponent },
      { path: 'phone-call', component: PhoneCallComponent },
      { path: 'settings', loadChildren: () => import('./pages/settings/settings.module').then(m => m.SettingsModule) },
      { path: 'real-estates', component: RealEstateListComponent },
      { path: 'real-estate/:id', component: RealEstateEditComponent },
      { path: 'users', component: UsersComponent },
    ]
  },
  {
    path: '**',
    redirectTo: 'dashboard'
  }
]

@NgModule({
  imports: [
    RouterModule.forRoot(AppRoutes, {
      scrollPositionRestoration: 'top',
      anchorScrolling: 'enabled',
      initialNavigation: 'enabledBlocking'
      // relativeLinkResolution: 'legacy'
    })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule { }

内容的提问来源于stack exchange,提问作者Marta Molinari

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.21 17:17:37