knockoutの基礎知識

Knockout Advent Calendar 2015

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-debug.js"></script>
あなたの名前は？:<input type="text" data-bind="value:myName">

<div>こんにちは！<span data-bind="text:myName"></span>さん</div>
<div>このページの滞在時間:<span data-bind="text:age"></span>秒です</div>

JavaScript

var vm = {
    myName: ko.observable("山田"),
    age: ko.observable(1)
}
setInterval(function(){
    vm.age( vm.age()+1 );
},1000);
ko.applyBindings(vm);