Configuring routes

There are a few ways to add routes to your router. You can specify your routes when creating a router instance and / or use chainable add and addNode methods to add routes.

Defining your routes as POJOs

You can define your routes as a flat array or nested array of routes. When using a flat array of routes, nested route names need to have their full name specified.

Route objects optionally accept the following properties:

Note on encodeParams and decodeParams: one can't be used without another, and applying one after another should be equivalent to an identity function.

encodeParams(stateParams: Object): Object

A function taking state params and returning path params.


Flat array of routes

const routes = [
    { name: 'users',      path: '/users'},
    { name: 'users.view', path: '/view'},
    { name: 'users.list', path: '/list'}

Nested arrays of routes

const routes = [
    { name: 'users', path: '/users', children: [
        { name: 'view', path: '/view'},
        { name: 'list', path: '/list'}

Nested arrays of routes

Adding routes to your router

You can add all your routes at once using createRouter or router.add.

createRouter(routes, options)

const router = createRouter(routes, options);


.add() accepts single nodes, flat or nested arrays.

myRouter.add({ name: 'about', path: '/about' });
// Or
    {name: 'about',   path: '/about'},
    {name: 'contact', path: '/contact'},

addNode(name, path[, canActivate])

You can add routes node by node, specifying a node name and its segment path.

var router = createRouter()
    .addNode('users',      '/users')
    .addNode('users.view', '/view/:id')
    .addNode('users.list', '/list');

Configuring the root node path

At the top of your tree of routes, there is an unamed node called the root node. Its path is empty and can be configured using router.setRootPath(path). It can be used for example to list a number of allowed query parameters for all routes in strict query parameters mode (router.setRootPath('?param1&param2')).