Angular-Routing
The Angular Router is an optional service that presents a particular component view for a given URL. It is not part of the Angular core. It is in its own library package, @angular/router
. Import what you need from it as you would from any other Angular package.
A routed Angular application has one singleton instance of the Router service. When the browser's URL changes, that router looks for a corresponding Route from which it can determine the component to display.
A router has no routes until you configure it. The following example creates four route definitions, configures the router via the RouterModule.forRoot method, and adds the result to the AppModule's imports
array.
After the end of each successful navigation lifecycle, the router builds a tree of ActivatedRoute
objects that make up the current state of the router. You can access the current RouterState
from anywhere in the application using the Router
service and the routerState
property.
Each ActivatedRoute
in the RouterState
provides methods to traverse up and down the route tree to get information from parent, child and sibling routes. The route path and parameters are available through an injected router service called the ActivatedRoute
.