This is the config properties you can specify inside data-bind="page: {...}". Consult the Event-page for the events you can specify.
data-bind: can either take a configuration object or a pager.Page-instance.

In HTML

<div data-bind="page: {id: 'someID', title: 'the page title', sourceOnShow: 'some.html', with: somePageViewModel}"></div>

In JavaScript

// create a page
var somePage = new pager.Page();
// configure the page (the keys are the configurations you can see on this API page)
valueAccessorObject = {
    id:"someID"
};
myPage.valueAccessor = function () {
    return valueAccessorObject;
};
// set the view model for the page
myPage.viewModel = {
    answer:42,
    question:'How many roads must a man walk down before you can call him a man?'
};
// bind the page to the main view model
var viewModel = {
    myPage:myPage
};

id : String

The ID of the page. It can be either a normal name or ?. ? means that it matches against any route. The ?-ID is useful for automatically matching against a large set of structured values.

<div data-bind="page: {id: 'search'}">
    <!-- Search for product here. Will only match #search -->
</div>
<div data-bind="page: {id: 'product'}">
    <!-- List all products here. Will only match #product -->
    <div data-bind="page: {id: '?', withOnShow: loadProduct}">
        <!-- This is a page for any product since the ID is ?. Will match any #product/.* -->
        <span data-bind="text: productName"></span>
    </div>
</div>
Setup Deep Navigation Matching Wildcards Deep Navigation with Wildcards

role: String

If your set role: 'start' the page will work as a start page, i.e. be the default page and work as if id: 'start'. The advantage of using role: 'start' is that you can have another id.

params : String[]

A list of URL parameters (of URL-like parameters in the fragment ID) that should be bound to the view-model of the page. If you specify params: ['age'] and the parameters for the current page got an age-parameter the value of that parameter will appear inside the view-model.

<div data-bind="page: {id: 'search', params: ['name', 'price']}">
    <label>Name <input type="text" data-bind="value: name"></span></label>
    <label>Price <input type="text" data-bind="value: price"></span></label>
</div>

and the user surfs to /search?name=TV&price=200 the user will see

Binding URI parameters Parameters as objects

nameParam: String/Observable

Binding Wildcard to observable

vars: Object

Custom observables in the view

with : Object

Works as the normal with-binding.

<div data-bind="page: {id: 'fry', with: fry}">
    The age of Fry is <span data-bind="text: age"></span>
</div>

where

var viewModel = {
    fry: ko.observable({age: ko.observable(27)})
}
This member should also be possible to supply a method as withOnShow, i.e. should be possible to be either an object or a method.
Change Binding Context

withOnShow : Function(Function(Object), Page)

This member makes it possible to lazy-bind a view-model once the page is first displayed. withOnShow takes a method that should take 2 arguments: a callback (that should be feeded the view-model) and the current Page-object.

This property is very useful when you want to split up your view-model for your single page application into multiple smaller view-models that can still communicate with each other. You might feed a page a view-model for a certain item.

If you set sourceCache: true the view-model will not reload every time you revisit the page.

<div data-bind="page: {id: '?', withOnShow: Cool.loadUser}">
    <h1 data-bind="text: userName"></h1>
</div>
Cool.loadUser = function(callback, page) {
    $.get('service/users/' + page.currentId, function(data) {
        callback(ko.mapping.fromJSON(data));
    });
};
This member should also be possible to supply an object as with, i.e. should be possible to be either an object or a method.
Lazy-Bind View-Model

source : String / Function(Page, Function())

Load content into the page from an external source.

Load External Content Load View using Custom Method

sourceOnShow : Function(Page, Function())

While source loads the content into the page directly the configuration sourceOnShow loads the content into the page when the page is first requested. This configuration can be further controlled using sourceCache.

Lazy-Load External Content Load View using Custom Method

sourceLoaded : Function(Page)

Register a callback whenever an external source (source or sourceOnShow) is loaded into the page. Useful for e.g. post-processing.

Load External Content

sourceCache : Boolean / Number

sourceCache will control both the caching of the lazy-loaded source and the lazy-loaded view-model.

If not set (or false) the lazy-loaded model (withOnShow) and view (withOnShow) will be requested every time the page is displayed.

If set to true both the lazy-loaded model and view are cached.

If set to a number the lazy-loaded view is cached that amount of time in seconds.

Cached Lazy-Loaded Content

frame : String

By specifying frame: 'iframe' the external source is loaded into an iframe instead.

Load Content into iframe Configure an iframe

modal : Boolean

If a page is configured as modal: true it can appear in child-pages of sibling-pages to the modal page.

Modals

hideElement : Function(Page,Function())

Custom Hide- and Show-Methods

showElement : Function(Page)

Custom Hide- and Show-Methods

fx : String

FX

loader : Function(Page,Node)

Loader

guard : Function(Page,String[],Function(),Page)

The first argument is the page being navigated to, the second argument is the route, the third argument is a callback and the fourth argument is the page being navigated from.

Guards

urlToggle :String

Control when the page will be displayed or hidden. There are three possible values: null (default), show or none. null is the normal behaviour. show makes the page show when the route is matching, but wont automatically hide. none means that the page does not react to the route. You'll need to control the visibility of the page in some other way. Pages with urlToggle: 'none' will be visible by default.

Pages that only toggle on

title : String

Controls the page title if set.

Show start page by default

bind: Observable

Binds the page-instance to a variable in the view model.

Binding to View Model

scrollToTop: Boolean

If true (scrollToTop: true) then scrolls the page into view when it is displayed. Used on this demo-page.