Web Development

Loading data is KnockoutJS is quite simple:

<div class='container'>
  <div class='row'>
    <div class='col-md-12'>
      <table data-bind= "foreach: records">
       <tr>
         <td data-bind="text: name"></td>
         <td data-bind="text: description"></td>
       </tr>
      </table>
    </div>
  </div>
</div>
<h1>Deals</h1>

<script>
    function dealModel() {
        var self = this;
        self.records = ko.observableArray([]);

        $.getJSON("/api/deals/index", function(data) {
            self.records(data);
        })
    }
    ko.applyBindings(new dealModel());
</script>

Loading Data

Data called by our friendly $.getJSON() call to our server:

$.getJSON("/api/deals/index", function(data) {
  self.records(data);
})

Note that jQuery is only one of the options used here. You can use any other means to load data.

Create observables

Creating observables is probably one of the important things to do here. This allows us to bind our records.

self.records = ko.observableArray([]);

Attach bindings

The only thing to do would be to loop through our records:

<table data-bind= "foreach: records">
  <tr>
    <td data-bind="text: name"></td>
    <td data-bind="text: description"></td>
  </tr>
</table>

Try it!

I have created a JSFiddle to show how it works. Enjoy!