[英]Lazy loading feature modules with multiple components doesn't work in angular 6
I have a customer
module with customer-routing
module: 我有一个customer
模块与customer-routing
模块:
const routes: Routes = [
{
path: '', component: CustomerComponent,
children: [
{ path: 'edit', component: EditCustomerComponent }
]
}
];
And this is my app-routing
module: 这是我的app-routing
模块:
const routes: Routes = [
{ path: 'customers/:id', loadChildren: './customer/customer.module#CustomerModule' },
{ path: 'login', component: LoginComponent}
];
But when I follow such path customers/3/edit
it shows me always CustomerComponent
not EditCustomerComponent
. 但是,当我按照这样的路径进行customers/3/edit
它始终显示CustomerComponent
而不是EditCustomerComponent
。
Maybe lazy loading doesn't work? 也许懒加载不起作用?
PS: I am using angular 6.1.0 PS:我使用角度6.1.0
Update: My customer module 更新:我的客户模块
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 { }
You don't have to put edit route under children. 您不必在子项下放置编辑路径。 Your customer-routing module would simply look like this: 您的客户路由模块将如下所示:
const routes: Routes = [
{ path: '', component: CustomerComponent },
{ path: 'edit', component: EditCustomerComponent }
];
Also make sure to check whether this routes array has been imported using forChild function in your customer-routing module like this: 还要确保在客户路由模块中使用forChild函数检查是否已导入此路由数组,如下所示:
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class CustomerRoutingModule { }
Hope this should solve your routing issue. 希望这可以解决您的路由问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.