foreach issue

by Salmin Skenderovic

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/2.2.1/knockout-min.js"></script>
<table>
  <tbody data-bind="foreach: {data: data, as: '_data'}">
    <tr data-bind="foreach: {data: Object.keys(props), as: '_propkey'}">
      <th data-bind="text: _propkey"></th>
      <td data-bind="text: _data.props[_propkey]"></td>
    </tr>
  </tbody>
</table>

JavaScript

function DataModel() {
    var self = this;
    self.data = ko.observableArray([{
        entityId: 1,
        props: {
            name: 'Name 1',
            lastLogin: '8/5/2012'
        }
    }, {
        entityId: 2,
        props: {
            name: 'Name 2',
            lastLogin: '2/8/2013'
        }
    }]);
    self.rows = ko.computed(function () {
        var rows = [];
        var data = self.data();
        for (index in data) {
            var datarow = data[index];
            var row = {
                entityId: datarow.entityId,
                cells: []
            };
            rows.push(row);
            for (name in datarow.props)
            if (datarow.props.hasOwnProperty(name)) row.cells.push(datarow.props[name]);
        }

        return rows;
    });
}

var dataModel = new DataModel();
ko.applyBindings(dataModel);