代码之家 › 专栏 › 技术社区 › Aydar Omurbekov

用多个组件延迟加载功能模块在Angular6中不起作用

angular6 angular

4

Aydar Omurbekov · 技术社区 · 6 年前

我有一个 customer 带的模块 customer-routing

const routes: Routes = [
  {
    path: '', component: CustomerComponent,
    children: [
      { path: 'edit', component: EditCustomerComponent }
    ]
  }
];

这是我的 app-routing 模块:

const routes: Routes = [
  { path: 'customers/:id', loadChildren: './customer/customer.module#CustomerModule' },
  { path: 'login', component: LoginComponent}
];

但当我走这条路的时候 customers/3/edit CustomerComponent 不 EditCustomerComponent .

更新: 我的客户模块

import {ReactiveFormsModule} from '@angular/forms';
import {CustomerComponent} from './customer.component';
import {EditCustomerComponent} from './edit-customer.component';

@NgModule({
  imports: [
    CommonModule,
    CustomerRoutingModule,
    ReactiveFormsModule
  ],
  declarations: [CustomerComponent, EditCustomerComponent]
})
export class CustomerModule { }

1 回复 | 直到 6 年前

1

4

Syed Sharique 6 年前

您不必将“编辑路由”放在“子级”下。您的客户路由模块简单地如下所示:

const routes: Routes = [
  { path: '', component: CustomerComponent },
  { path: 'edit', component: EditCustomerComponent }
];

还要确保检查是否已使用客户路由模块中的forChild函数导入此路由数组,如下所示:

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class CustomerRoutingModule { }