i'm writing application features got it's own module (a feature page, or part of page). because want features have it's own domain logic, services, directives , components, i.e. in dashboard module got chartcomponent widget don't want expose other views login or profile.
the problem when working routing in angular 2 routes particular component, not module.
in our case, set route path: '/dashboard' component: dashboardcomponent need declare dashboardcomponent in app.module.ts, , that's fine, since we're still in module app.module our charcomponent not exposed , not render in our dashboardcomponent since it's declared in dashboard.module.ts , not app.module.ts.
if declare chartcomponent in app.module.ts it's working should lost architecture our application.
the file structure application this:
└─ src/ └─ app/ ├─ app.module.ts ├─ app.component.ts ├─ app.routing.ts ├─ profile/ | ├─ profile.module.ts | └─ profile.component.ts ├─ login/ | ├─ login.module.ts | └─ login.component.ts └─ dashboard/ ├─ dashboard.module.ts └─ dashboard.component.ts └─ chart/ └─ chart.component.ts
it's not necessary import components main(app) module,
if loading routes lazily may define path below,
// in app module route { path: 'dashboard', loadchildren: 'app/dashboard.module#dashboardmodule' } // in dashboard module const dashboardroutes: routes = [ { path: '', component: dashboardcomponent } ]; export const dashboardrouting = routermodule.forchild(dashboardroutes); @ngmodule({ imports: [ dashboardrouting ], declarations: [ dashboardcomponent ] }) export class dashboardmodule { }
or
you may import dashboardmodule
in main module , work if routes not lazily loaded.
@ngmodule({ imports: [ browsermodule, formsmodule, dashboardmodule, routing ], declarations: [ appcomponent ], providers: [ approutingproviders ], bootstrap: [ appcomponent ] }) export class appmodule { }
hope helps!!
Comments
Post a Comment