淘汰赛和检查数据绑定

Question

我正在尝试在这种情况下获得选中的复选框：

<div id='main'>
    <table>
        <tbody data-bind="foreach: Years">
            <tr>
                <td>
                    <input type="checkbox" data.bind="checked: $root.SelectedYears"/>
                </td>
                <td><span data-bind="text: descr" />
                </td>
            </tr>
        </tbody>
    </table>
    <br>
    <input type="button" value="Click!" data-bind="click: count">
<div/>

function vm() {
    this.Years = 
    [
        {
            code: "2011",
            descr: "descr 2011"
        },
        {
            code: "2012",
            descr: "descr 2012"
        },
        {
            code: "2013",
            descr: "descr 2013"
        },
        {
            code: "2014",
            descr: "descr 2014"
        }
    ];

    this.SelectedYears = ko.observableArray(this.Years);

    count = function()
    {
        alert(this.SelectedYears.length);
    };

    return this;
}
ko.applyBindings(new vm());

http://jsfiddle.net/angelobadellino/UXKt9/

当我单击按钮时，我的 SelectedYears 集合为空。它应该用选中的复选框来填充。

你能帮我理解我哪里错了吗？

Answer 1

SelectedYears 是一个ko.observableArray，它本身不是一个数组，即使它公开了Array 的一些方法。但是没有length 属性。要获取实际数组并检索大小，请使用：

alert(this.SelectedYears().length);

但是，您的其余代码可能无法按预期工作，因为您不能将 checked 绑定与这样的数组一起使用：

data.bind="checked: $root.SelectedYears"

checked 需要评估为真或假的东西，您可以考虑使用writable computed observable 将复选框绑定到您的SelectedYears 数组。

Answer 2

试试：

alert(this.SelectedYears().length);

它是一个 observable，所以你需要把它当做一个来调用。