Angular 4 - Routes - How to create a separate module for managing routes and use it in app.module.ts file

前端 未结 2 1153
情深已故
情深已故 2021-01-14 18:21

I am newbie in Angular, I want to implement the routes in separate component and import the same component in app.module.ts file. How do I import t

2条回答
  •  醉梦人生
    2021-01-14 18:38

    you should create a separate module for routing and add your router info in this module.

    like this:

    routing.module.ts file structure

    import { NgModule } from '@angular/core';
    import { RouterModule, Routes } from '@angular/router';
    
    import { LoginComponent } from './user/login/login.component'; //your component
    
    const routes: Routes = [
        { path: 'login', component: LoginComponent}
      ];
    
    @NgModule({
      imports: [ RouterModule.forRoot(routes) ],
      exports: [
          RouterModule
       ] 
    })
    export class RoutingModule { };
    

    import RouterModule and config your routs info then export your config (in export section of router module) for another module like app.module.

    then import and inject your routing module to your base module app.module

    like this:

    app.module.ts file structure

    import { RoutingModule } from './routing.module';
    
    @NgModule({
      declarations: [],
      imports: [
        RoutingModule
      ],
      exports: [],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule {}
    

提交回复
热议问题