Router API

The Dojo Router exposes an API that can be used to generate and navigate to links, get the params for the current route and check if an outlet id has been matched.

link(outlet: string, params: Params = {}): string | undefined: Generate a link based on the outlet id and optionally params. If no params are passed it will attempt to use the current routes parameters, then any default parameters provided in the routing configuration. If a link cannot be generated, undefined is returned.
setPath(path: string): void: Sets the path in the router.
get currentParams(): { [string: index]: string }: Returns parameters in the current route
getOutlet(outletIdentifier: string): OutletContext | undefined: Returns the OutletContext for an outlet id if it is currently matched. If the outlet id is not matched, then return undefined.

Generating a link for an outlet

src/routes.ts

export default [
    {
        path: 'home',
        outlet: 'home'
    },
    {
        path: 'about',
        outlet: 'about-overview',
        children: [
            {
                path: '{services}',
                outlet: 'about-services',
                defaultParams: {
                    services: 'sewing'
                }
            },
            {
                path: 'company',
                outlet: 'about-company'
            },
            {
                path: 'history',
                outlet: 'about-history'
            }
        ]
    }
];

src/main.ts

import Router from '@dojo/framework/routing/Router';

import routes from './routes';

const router = new Router(routes);

// returns `#home`
console.log(router.link('home'));

// returns `#about`
console.log(router.link('about-overview'));

// returns `#about/company`
console.log(router.link('about-company'));

// returns `#about/history`
console.log(router.link('about-history'));

// returns `#about/knitting`
console.log(router.link('about-services'), { services: 'knitting' });

// Uses the current URL then default params to returns `#about/knitting`
// when the current route is `#about/cooking` returns `#about/cooking`
// when the current route does not contain the params returns `#about/sewing`
console.log(router.link('about-services'));

// returns `undefined` for an unknown route
console.log(router.link('unknown'));

Changing a route

import Router from '@dojo/framework/routing/Router';

import routes from './routes';

const router = new Router(routes);

// goto `#home` route
router.setPath('#home');

Getting the current parameters

import Router from '@dojo/framework/routing/Router';

import routes from './routes';

const router = new Router(routes);

// returns the current params for the route
const params = router.currentParams;

Get a matched outlet

Use the getOutlet to return the OutletContext for a matched outlet, or undefined if the outlet is not matched.

OutletContext:

id: string: The outlet id
queryParams: { [index: string]: string }: The query params from the matched routing.
params: { [index: string]: string }: The path params from the matched routing.
isExact(): boolean: A function indicates if the outlet is an exact match for the path.
isError(): boolean: A function indicates if the outlet is an error match for the path.
type: 'index' | 'partial' | 'error': The type of match for the route, either index, partial or error.

import Router from '@dojo/framework/routing/Router';

import routes from './routes';

const router = new Router(routes);

// returns the outlet context if the `home` outlet is matched, otherwise `undefined`
const outletContext = router.getOutlet('home');