项目结构:
/app
app.module.ts
app.routing.ts
:
:
/dashboardModule
/manage-productModule
manage-product.module.ts
manage-product.routing.ts
在'app.routing.ts'
中[
{
path : '',
loadchildren: 'loginModulepath/loginmoduleName#className'
},
{
path : 'dashboard',
component: dashboardReportComponent
}
{
path : 'manage-products'
loadchildren: 'manage-productModule-path/manage-product-moduleName#manageProductClassName'
}
]
在模块中:管理products/manage-product.routing.ts
const manageProdRoute =
[
{
path : '',
component: manageProductListComponent
},
{
path : 'detail',
component: manageProdDetailComponent
}
]
和,
import:[ routerModule.forChild(manageProdRoute)]
目标:
如果用户类型url:port/
=>它将重定向到url:port/login/
如果用户类型/单击链接go url:port/manage-products
=>它将加载 manageProductListComponent
问题
但是,当我尝试加载URL:port
以转到登录页面时,它会加载manageProductListComponent
。即使我从app.routing.ts
评论manage-product
部分,它的行为相同,但是如果我提到app.routing.ts
中所有模块的所有孩子,则可以正常工作。
问题我需要采取的措施将所有基于模块的路由保留在单个routing.ts
中并在app.routing.ts
中导入它们,以便它们在?
您可以使用以下代码示例: -
[
{ path: '', redirectTo: 'login', pathMatch: 'full'},
{ path: 'login',
children: [
{ path: '', component: yourLoginComponent},
{ path: 'dashboard', component: your-dashboardReportComponent},
]
},
{ path: 'manage-products',
children: [
{ path: '', component: your-manageProdDetailComponent},
]
},
];
您已将空的路径匹配为 ManageProductListComponent 是原因
{
path : '',
component: manageProductListComponent
},