Define Routes

In Angular, a route is an object (instance of Route) that provides information about which component maps to a specific path. A path is the fragment of a URL that determines where exactly is located the resource (or page) you want to access. You can get the path by taking off the domain name from the URL.

In Angular you can define a route using route configurations or instances of the Route interface.

A collection of routes defines the router configuration which is an instance of Routes.

Each route can have the following properties:

• path is a string that specifies the path of the route.

• ​pathMatch is a string that specifies the matching strategy. It can take prefix (default) or full.

• component is a component type that specifies the component that should be mapped to the route.

• ​redirectTo is the URL fragment which you will be redirected to if a route is matched.

• ​canActivatedetermine if the current user is allowed to activate the component. By default, any user can activate.

These are the commonly used properties of routes but there are many others. You can find the rest of properties from the official docs.

For example, this is the definition of a route that maps the /dashboards/main/ path to the HomeComponent component:

{ path: 'dashboards/main/', component: HomeComponent }

The path can be the empty string which usually refers to the main URL of your application or can be also a wildcard string (**) which will be matched by the router if the visited URL doesn’t match any paths in the router configuration. This is usually used to display a page doesn’t exist message or redirect the users to an existing path.