我目前有一个工作的Angular 4应用程序,带有变量占位符的参数化路由,即 :zoneId
:schemaId
:id
. 我不想摆脱这些,但现在我们正在转换我们的应用程序使用延迟加载,我无法弄清楚这些参数化路线的去向 .
目前app-routing.module.ts(导入app-module.ts)有
const ROUTES: Routes = [
{
path: 'zones/:zoneId/schemas/:schemaId/errands/:id',
component: ErrandDetailComponent
但是我正在遵循的所有例子都是这些
https://toddmotto.com/lazy-loading-angular-code-splitting-webpack https://medium.com/@kouipheng.lee/lazy-loading-with-angular-4-29c23792b7f4
似乎让我擦掉这条路径并给出一个通用名称并使用 loadChildren
路由器,它需要模块的路径 #SomeModuleName
这会使我的代码看起来像这样:
const ROUTES: Routes = [
{
path: 'errandDetailComponent',
loadChildren: './items/errands/errand-routing.module#ErrandRoutingModule',
component: ErrandDetailComponent
Here is my issue because I don't know where I can use my parameterized routes now.
为了完整起见,我的子路由器看起来像这样:
const errandRoutes: Routes = [
{
path: '', // APPARENTLY THIS MUST BE EMPTY FOR LAZY LOADING TO WORK SO CAN'T PUT PARAMETERIZED PATH IN HERE EITHER
component: ErrandDetailComponent,
resolve: { errand: ErrandResolver },
}
];
@NgModule({
imports: [
RouterModule.forChild(errandRoutes)
],
declarations: [ErrandRoutingModule],
exports: [
RouterModule
],
})
export class ErrandRoutingModule { }
1 回答
对于此设置,您可以使用子路径重新添加参数 .
app-routing.module.ts
errands-routing.module.ts
而且你只需要一个非常薄的
ErrandsComponent
来显示细节组件 .errands.component.ts