Question

我有一个可观察的一些项目数组（简单的数字对），我想将它绑定到一个表。然后我想绑定一个计算的observable，它循环第一个数组并通过分组来汇总一些值。我的foreach循环工作正常并按组总结数字（正如你可以通过取消注释我的警报看到的），但它永远不会绑定到html。看下面的小提琴。我哪里错了？

function DataPoint(group, num) {
this.group = group;
this.num = num;
}
function TestViewModel() {
var self = this;

self.data = ko.observableArray([
    new DataPoint(1, 1),
    new DataPoint(2, 5),
    new DataPoint(3, 9),
    new DataPoint(3, 10),
    new DataPoint(4, 3),
    new DataPoint(4, 6),
    new DataPoint(5, 3),
    new DataPoint(5, 9),
    new DataPoint(6, 7),
    new DataPoint(7, 2),
    new DataPoint(8, 8),
    new DataPoint(8, 4),
    new DataPoint(9, 3),
    new DataPoint(11, 6)
])

self.groupedData = ko.computed(function () {
    var total = 0;
    var group = -1;
    var myArray = self.data();
    var counter = 0;
    var rows = self.data().length;
    var result = ko.observableArray([]);
    ko.utils.arrayForEach(myArray, function (item) {
        if (group == -1) {
            group = item.group;
        }
        if (group == item.group) {
            total += parseInt(item.num)
        } else {
            var d = new DataPoint(group, total);
            result.pop(d);
            total = 0;
            group = item.group;
            total += parseInt(item.num)
            //alert(d.group + ':' + d.num);
        }
        if (counter == rows - 1) {
            var d = new DataPoint(group, total);
            result.pop(d);
            //alert(d.group + ':' + d.num);
        }
        counter += 1;
    });
    return result();
    },self);
}

ko.applyBindings(new TestViewModel());

和html

<body>
Ungrouped Data

<table>
    <thead>
        <tr>
            <td>Group</td>
            <td>Sum</td>
        </tr>
    </thead>
    <tbody data-bind="foreach: data">
        <tr>
            <td>
                <span data-bind="text: group"></span>
            </td>
            <td>
                <span data-bind="text: num"></span>
            </td>
        </tr>
    </tbody>
</table>
<br />
Grouped Data
<table>
    <thead>
        <tr>
            <td>Group</td>
            <td>Sum</td>
        </tr>
    </thead>
    <tbody data-bind="foreach: groupedData">
        <tr>
            <td>
                <span data-bind="text: group"></span>
            </td>
            <td>
                <span data-bind="text: num"></span>
            </td>
        </tr>
    </tbody>
</table>
<script src="Scripts/lib/knockout-3.0.0.js"></script>
<script src="Scripts/app/TestViewModel.js"></script>
</body>

http://jsfiddle.net/gaku6mku/1/

提前感谢任何建议！

Answer 1

result.pop(d)应为result.push(d)。

在荷马辛普森不朽的话语中......哇！

我可以绑定到计算的可观察数组（淘汰赛）吗？

1 个答案: