KO Simple

by Rajesh Sitaraman

HTML

<h2>Participants</h2>
Here are the participants:
<div data-bind="template: { name: 'person-template', foreach: people }"></div>
<script type="text/html" id="person-template">
    <h3 data-bind = "text: name" > </h3>
    <p>Credits: <span data-bind="text: credits"></span > </p>
</script>

JavaScript

function MyViewModel() {
    this.people = [{
        name: 'Franklin',
        credits: 250
    }, {
        name: 'Mario',
        credits: 5800
    }]
}
ko.applyBindings(new MyViewModel());