Knockback.js

Knockback.js API and Usage Examples

kb.Observables

Used to generate observables manually for a model's attributes

Example:

ContactViewModel = (model) ->
  @attribute_observables = kb.observables(model, {
    name:     {key: 'name', read_only: true}
    number:   'number'
    date:     {key:'date', localizer: LongDateLocalizer}
    name2:    {key: 'name', read_only: true}
  }, this)
  @
  
model = new Contact({name: 'John', number: '555-555-5558', date: new Date(1940, 10, 9)})
view_model = new ContactViewModel(model)

var ContactViewModel = function(model) {
  this.attribute_observables = kb.observables(model, {
    name:     {key: 'name', read_only: true}
    number:   'number'
    date:     {key:'date', localizer: LongDateLocalizer}
    name2:    {key: 'name', read_only: true}
  }, this);
};

var model = new Contact({name: 'John', number: '555-555-5558', date: new Date(1940, 10, 9)});
view_model = new ContactViewModel(model);

kb.observables(model, mappings_info, [view_model], [options]) factory

Used to create a new instance

Parameters
  1. model:{ Backbone.Model }:the model whose attributes will be synchronized
  2. mappings_info:{ [mapping_info as would be passed to each kb.observable | string for an attribute key] + {key: string}}:
  3. view_model: optional the view model target to set the properties for each mapped attribute (the kb.Observables instance itself will always have the generated observables set in its properties) '
  4. options: optional{ boolean for read_only | {read_only: boolean} }: the view model target to set the properties for each mapped attribute (the kb.Observables instance itself will always have the generated observables set in its properties)

Example:

view_model = {}
kb.observables(model, {name: 'name', date: 'date'}, view_model)

var view_model = {};
kb.observables(model, {name: 'name', date: 'date'}, view_model);

constructor(model, mappings_info, [view_model], [options])

Used to create a new instance

Parameters
  1. model:{ Backbone.Model }:the model whose attributes will be synchronized
  2. mappings_info: { [mapping_info as would be passed to each kb.observable | string for an attribute key] + {key: string}}:
  3. view_model: optional the view model target to set the properties for each mapped attribute (the kb.Observables instance itself will always have the generated observables set in its properties)
  4. options: optional { boolean for read_only | {read_only: boolean} }: the view model target to set the properties for each mapped attribute (the kb.Observables instance itself will always have the generated observables set in its properties)

Example:

view_model = {}
new kb.Observables(model, {name: 'name', date: 'date'}, view_model)

var view_model = {}
new kb.Observables(model, {name: 'name', date: 'date'}, view_model);

destroy()

Used to release the memory of the object

setToDefault()

Used to return all of the owned observables to their default values (if they exist)
ContactViewModel = (model) ->
  @loading_message = ko.observable('(none)')
  @attribute_observables = kb.observables(model, {
    name:     {key:'name', default: @loading_message}
    number:   {key:'number', default: @loading_message}
  }, this)
  @
  
view_model = new ContactViewModel(new Backbone.Model({name: 'Bob'}))
# name is Bob and number is (none)

view_model.setToDefault()
# name and number are (none)

view_model.loading_message('(nada)')
# name and number are (nada)

var ContactViewModel = function(model){
  this.loading_message = ko.observable('(none)');
  this.attribute_observables = kb.observables(model, {
    name:     {key:'name', default: @loading_message},
    number:   {key:'number', default: @loading_message}
  }, this);
};

var view_model = new ContactViewModel(new Backbone.Model({name: 'Bob'}));
// name is Bob and number is (none)

view_model.attribute_observables.setToDefault()
// name and number are (none)

view_model.loading_message('(nada)')
// name and number are (nada)