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.
class RouterModule { static forRoot(routes: Route[], config?: ExtraOptions): ModuleWithProviders<RouterModule> static forChild(routes: Route[]): ModuleWithProviders<RouterModule> }
Routing and Navigation guide for an overview of how the Router
service should be used.
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:
forRoot()
method creates an NgModule
that contains all the directives, the given routes, and the Router
service itself.forChild()
method creates an NgModule
that contains all the directives and the given routes, but does not include the Router
service. forRoot() | ||||||
---|---|---|---|---|---|---|
Creates and configures a module with all the router providers and directives. Optionally sets up an application listener to perform an initial navigation. | ||||||
|
routes | Route[] | An array of |
config | ExtraOptions | An Optional. Default is |
ModuleWithProviders<RouterModule>
: The new NgModule
.
When registering the NgModule at the root, import as follows:
@NgModule({ imports: [RouterModule.forRoot(ROUTES)] }) class MyNgModule {}
forChild() | |||
---|---|---|---|
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: | |||
|
routes | Route[] | An array of |
ModuleWithProviders<RouterModule>
: The new NgModule.
@NgModule({ imports: [RouterModule.forChild(ROUTES)] }) class MyNgModule {}
Name | Description |
---|---|
RouterLink | When applied to an element in a template, makes that element a link that initiates navigation to a route. Navigation opens one or more routed components in one or more |
RouterLinkActive | Tracks whether the linked route of an element is currently active, and allows you to specify one or more CSS classes to add to the element when the linked route is active. |
RouterLinkWithHref | Lets you link to specific routes in your app. |
RouterOutlet | Acts as a placeholder that Angular dynamically fills based on the current router state. |
© 2010–2021 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v11.angular.io/api/router/RouterModule