• Overview
@angular/router

RouterModule

NgModule

Adds directives and providers for in-app navigation among views defined in an application. Use the Angular Router service to declaratively specify application states and manage state transitions.

API

  
    class RouterModule {}
  
  

forRoot

ModuleWithProviders<RouterModule>

Creates and configures a module with all the router providers and directives. Optionally sets up an application listener to perform an initial navigation.

When registering the NgModule at the root, import as follows:

          
@NgModule({  imports: [RouterModule.forRoot(ROUTES)]})class MyNgModule {}
@paramroutesRoutes

An array of Route objects that define the navigation paths for the application.

@paramconfigExtraOptions | undefined

An ExtraOptions configuration object that controls how navigation is performed.

forChild

ModuleWithProviders<RouterModule>

Creates a module with all the router directives and a provider registering routes, without creating a new Router service. When registering for submodules and lazy-loaded submodules, create the NgModule as follows:

          
@NgModule({  imports: [RouterModule.forChild(ROUTES)]})class MyNgModule {}
@paramroutesRoutes

An array of Route objects that define the navigation paths for the submodule.

Description

Adds directives and providers for in-app navigation among views defined in an application. Use the Angular Router service to declaratively specify application states and manage state transitions.

You can import this NgModule multiple times, once for each lazy-loaded bundle. However, only one Router service can be active. To ensure this, there are two ways to register routes when importing this module:

  • The forRoot() method creates an NgModule that contains all the directives, the given routes, and the Router service itself.
  • The forChild() method creates an NgModule that contains all the directives and the given routes, but does not include the Router service.
Jump to details