Routes

A route maps a URL path to a view and a controller. Bindary loads whichever one matches the current path and swaps them out again as soon as the path changes.

Registering a route

$bindary.addRoute() takes a path, an exact string or a RegExp, plus a viewURL and controllerURL for what to load when that path matches.

// exact string match
$bindary.addRoute({
    path: 'about',
    viewURL: 'views/about.html',
    controllerURL: 'controllers/about.js'
});

// regex match with a capture group
$bindary.addRoute({
    path: /^products\/([^\/]+)$/,
    viewURL: 'views/products/$1.html',
    controllerURL: 'controllers/products.js'
});

A regex path can carry capture groups and $1, $2 and so on refer to them in viewURL and controllerURL, so products/chair loads views/products/chair.html with $1 resolved to chair. Building that string is entirely up to you, a plain literal like above, concatenation, a small helper function, whatever suits your project, Bindary only cares about the final string it receives.

Routes are matched in the order they were added, in $bindary.routes. A catch-all pattern needs to be registered after the more specific routes or it swallows everything before they get a chance to match.

$bindary.addRoute({ path: 'home', viewURL: 'views/home.html' });
$bindary.addRoute({ path: /^products\/([^\/]+)$/, viewURL: 'views/products/$1.html' });
$bindary.addRoute({ path: /^([^\/]+)$/, viewURL: 'views/$1.html' }); // catch-all, registered last

dataConnect: false skips the automatic data request that would otherwise fire when this route loads. It doesn't disable the connection itself, that's controlled by separate settings covered on Backend, $bindary.dataSend() still works from a dataConnect: false route, this only opts out of the automatic one. Leave it out to have that automatic request fire by default.

The active route

Once a route is loaded, Bindary exposes it on a handful of top-level properties: $bindary.route (the matched route object), $bindary.routeIndex, $bindary.routePath, $bindary.controller (the loaded controller, ctrl in your controller file) and $bindary.routeData, the data container scoped to this route.

Controller lifecycle: load, postLoad, unload

Three methods on the controller cover a route's lifetime, if present, Bindary calls them automatically, no wiring needed on the route itself: load once before the first render, postLoad once after it, unload once when the route is about to be replaced. See Controller for the full signatures and behavior, all seven route-level hooks are listed there together.

If the route has dataServerUnload set, Bindary also sends it to the server as this route unloads, see unloading, on Backend.

These three names, load, postLoad, unload, are the defaults. A route can point to different method names instead through controllerLoad, controllerPostLoad and controllerUnload if a controller needs to reuse the same file for more than one route without clashing.

Per-render and per-update hooks

A route also supports preRender/postRender, which run around every render rather than once per route and preDataUpdate/postDataUpdate, which run around every incoming data update. Same idea as above, present on the controller and Bindary picks them up automatically, but these fire repeatedly over the route's lifetime instead of once. See Controller for their exact signatures, all seven route-level hooks are listed there together.