Monday, May 28, 2012


Knockout is a JavaScript library that allows developers to create rich, responsive display and editor user interfaces with a clean underlying data model.  


  1. Declarative bindings
    A simple and obvious way to connect parts of your UI to your data model.
    <p>First name: <input id= "elementId" data-bind="value: firstName" /></p>
    <p>Last name: <input data-bind="value: lastName" /></p>
    <h2>Hello, <span data-bind="text: fullName"> </span>!</h2>
    $("#elementId").attr("data-bind","value: firstName");

    View Model
    var viewModel = { 
                    firstName : ko.observable("Planet"),
                    lastName : ko.observable("Earth"),
                    fullName = ko.computed(function() {
                        return this.firstName() + " " + this.lastName();
                    }, this);
    Here is the list of all built in Bindings.
  2. Automatic UI refresh
    When the data model's state changes, the UI updates automatically.
  3. Dependency tracking
    Implicitly set up chains of relationships between model data,
    to transform and combine it.

    Automatically updates the right parts of your UI whenever your data model changes.
  4. Templating
    Quickly generate sophisticated, nested UIs as a function of your model data.
    Templates are a simple and convenient way to build sophisticated UI structures -
    possibly with repeating or nested blocks.           Unit Testing with Qunit >>

No comments:

Post a Comment