问题描述: 全部的路由以及子路由都定义在一个app-routing.module.ts里, 有没有什么可优化的方案?
如下是总路由ts文件实现代码
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { DemoComponent } from './demo/demo.component';
import { ProductComponent } from './demo/product/product.component';
const routes: Routes = [
{
path: 'demo',
component: DemoComponent,
children: [
{
path: 'product',
component: ProductComponent
}
]
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
以下是html代码以及界面效果
http://localhost:4200/demo/pr...
现在想在 app-routing.module.ts
仅仅定义 path: 'demo'
路由, 而demo下的子路由定义在 demo-routing.module.ts
. 让 app-routing.module.ts
去引用 demo-routing.module.ts
主要目的是不要把全部的路由以及子路由都定义在一个 app-routing.module.ts
. 有没有什么实现思路?
在网上查了一下好像所有的案例都是把全部路由定义在一个文件里, 后期如果想对路由进行分类的话应该怎么处理?
已解决, 使用loadChildren