observer analogy

HTML

<form>            
    <label> snelheid </label>
    <input type=text data-bind="value: snelheid"></input>
    
    <label> tijd </label>
    <input type=text data-bind="value: tijd"></input>
    
    <label> afstand </label>    
    <div data-bind="text: afstand"></div>
</form>

CSS

label {
    display: block;
    font-weight: bold;
}

JavaScript

var snelheid = ko.observable(50);
var tijd = ko.observable(3.5);
var afstand = ko.computed(function() {
    return snelheid()*tijd();
});

var appViewModel = {
    "snelheid": snelheid,
    "tijd": tijd,
    "afstand": afstand
};

ko.applyBindings(appViewModel);