-
Notifications
You must be signed in to change notification settings - Fork 0
7_Implementin lazy loading and Routing
Please note while we had generated application, we had used --routing flag with it to create app-routing.module.ts with empty routes.
code goes here
use ng g m <module_name> --routing
command to create modules with routing. Please note that this is a shell module because under-neath it we will create further modules which will be loaded whenever required.
code goes here
- Please note that we don't have to import newly created modules in app.module.ts or app-routing.module.ts
- Declaring 'PageNotFoundComponent' and 'AccessDeniedComponent' not required in inner modules and further down as app routing will take care of wrong/unreachable routes.
again same as step2, we will create routing along with modules.this routing will have components uder routes array.
const routes:Routes=[{path:ROUTE_CONSTANTS.DEFAULT_ROUTE,redirectTo:ROUTE_CONSTANTS.SEARCH_ROUTE,pathMatch:ROUTE_CONSTANTS.PATH_MATCH_FULL},{{path:ROUTE_CONSTANTS.SEARCH_ROUTE,component: HelperComponent}]
in the above routes,we have HelperComponent which is an individual component route. which is a base component for exception helper module. we will have search and details compoenents under modules level1 base component. we have used below route-constants in above routes:
export const ROUTE_CONSTANTS = {DEFAULT_ROUTE:'',PATH_MATCH_FULL:'full',WILDCARD_ROUTE:'**',ACCES-DENIED_ROUTE:'access-denied',SEARCH_ROUTE:'search'}
Below code demonstrate route for single main menu. In similar sense, we can create routes for other main menu items.
code goes here