Knockout templates

How to compose pages using smaller templates

by anilkamath87

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.4.0/bootstrap.min.css">
<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.2.1.js"></script>
<script type="text/html" id="person-template">
    <h3 data-bind="text: name"></h3>
    <p>Credits: <input data-bind="value: credits"></span></p>
</script>
 
<h2>Participants</h2>
Here are the participants:
<div data-bind="template: { name: 'person-template', data: buyer }"></div>
<div data-bind="template: { name: 'person-template', data: seller }"></div>

JavaScript

function MyViewModel() {
         this.buyer = { name: 'Franklin', credits: ko.observable(250) };
         this.seller = { name: 'Mario', credits: ko.observable(5800) };     
         this.changed=false;
         var buyer=this.buyer;
         
         this.buyer.credits.subscribe(function(){
         console.log("b");             
         });
         this.buyer.test=ko.computed(function(){
             buyer.credits();
             console.log("a");
             this.changed=true;
         });
     }
     ko.applyBindings(new MyViewModel());