angular4定义路由遇到的那些事

1、将所有的路由写在app.module.ts里面

---

主要步骤：

1、在app.module.ts里面引入路由模块   import { RouterModule, Routes } from '@angular/router';

2、在imports里面导入改模块   imports: [ RouterModule.forRoot(routes) ]，括号里面的routers是自己       定义的路由，具体定义如下：

3、定义自己的路由如下：其中path代表路径，component为自己定义的组件

       const routes: Routes = [

           { path: 'login', component: loginComponent}

     ];

4、总的的代码如下，比较简单：

5、要是想要定义二级路由只需要给原有路由加上children即可，代码如下：

{

     path:'login', component: loginComponent, 

         children: [ { path:'childA', component: ChildAComponent }] 

 }

6、但是随着业务需求的增加，路由全部写在app里面并不好维护，并不建议

2、将路由分离出来形成独立的路由module，然后在app里面导入

---

主要步骤：

1、新建立一个module叫RouteRoutingModule，同样在该文件里面引入路由模块

2、同样需要在imports里面引入RouterModule.forRoot(routes)，因为这里面的东西需要暴露出去       给其他模块使用，所以这里需要在exports里面到处RouterModule， exports: [RouterModule],

3、在app.module里面引入import { RouteRoutingModule } from './routers/routes-routing.module';         然后在inport里面加入RouteRoutingModule 

4,、我们也可以通过loadChildren的方式引入路由

5、center.module.ts文件如下，这样我们就可以通过index/detail路径访问的center.component里         面的东西了