Angular-路由:html-模板中的路由 link 无法与路由模块中定义的路由匹配
Angular-routing: Routing link in html-template can't be matched with a route defined in the routing-modules
我有一个关于路由的问题(模块内的多个路由,延迟加载)。
假设我有 2 个模块
1-app.routing.module.ts
2-user.management.routing.module.ts
在应用程序路由模块文件中,我有
const appRoutes: Routes = [
{ path: '', redirectTo: '/login', pathMatch: 'full' },
{ path: 'login', loadChildren: () => import('../app/user.management/user.management.module')
.then(m => m.UserManagementModule) }
]
@NgModule({
imports: [RouterModule.forRoot(appRoutes)],
exports: [RouterModule]
})
export class AppRoutingModules {}
和内部用户管理路由模块文件
const userManagementRouting: Routes = [
{ path: '', component: LoginComponent },
{ path: 'forgot-password', component: ForgotPasswordComponent }
];
@NgModule({
imports: [RouterModule.forChild(userManagementRouting)],
exports: [RouterModule]
})
export class UserManagementRoutingModule { }
当我 运行 使用“ng serve”的应用程序时,它按预期工作。我添加了一个 link 喜欢
<a class="btn btn-link" routerLink="/forgot-password">Forgot Password </a>
当我点击忘记密码时 link 应用抛出错误
"Error: Uncaught (in promise): Error: cannot match any routes. URL segment: 'forgot-password'"
"Cannot match any routes. URL segment: 'forgot password"
你能指导我了解我的代码有什么问题吗?
如果 R. Richards 的建议也不起作用,请尝试
routerLink=['/forgot-password']
或
routerLink=['/login/forgot-password']
请注意,您使用的是相对路径。那么这个 Html-模板位于何处?
您也可以使用绝对路径。
如果无法解决,请告诉我们。保重,祝你好运。
我有一个关于路由的问题(模块内的多个路由,延迟加载)。
假设我有 2 个模块
1-app.routing.module.ts 2-user.management.routing.module.ts
在应用程序路由模块文件中,我有
const appRoutes: Routes = [
{ path: '', redirectTo: '/login', pathMatch: 'full' },
{ path: 'login', loadChildren: () => import('../app/user.management/user.management.module')
.then(m => m.UserManagementModule) }
]
@NgModule({
imports: [RouterModule.forRoot(appRoutes)],
exports: [RouterModule]
})
export class AppRoutingModules {}
和内部用户管理路由模块文件
const userManagementRouting: Routes = [
{ path: '', component: LoginComponent },
{ path: 'forgot-password', component: ForgotPasswordComponent }
];
@NgModule({
imports: [RouterModule.forChild(userManagementRouting)],
exports: [RouterModule]
})
export class UserManagementRoutingModule { }
当我 运行 使用“ng serve”的应用程序时,它按预期工作。我添加了一个 link 喜欢
<a class="btn btn-link" routerLink="/forgot-password">Forgot Password </a>
当我点击忘记密码时 link 应用抛出错误
"Error: Uncaught (in promise): Error: cannot match any routes. URL segment: 'forgot-password'"
"Cannot match any routes. URL segment: 'forgot password"
你能指导我了解我的代码有什么问题吗?
如果 R. Richards 的建议也不起作用,请尝试
routerLink=['/forgot-password']
或
routerLink=['/login/forgot-password']
请注意,您使用的是相对路径。那么这个 Html-模板位于何处?
您也可以使用绝对路径。
如果无法解决,请告诉我们。保重,祝你好运。