复选框的Knockout.js双向绑定不起作用

问题描述

我是敲门.js的新手，但复选框的双向绑定存在一些麻烦。

我有一个绑定到“公司”列表的表。

<table>
    <thead>
        <tr>
            <th>...</th>
            <th>...</th>
            <th>...</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: companies">
        <tr>                
            <td>...</td>
            <td><input type="checkbox" data-bind="checked:isCompanyForCommunication, click:$root.checkedNewCompanyForCommunication" /></td>
            <td>...</td>
        </tr>
    </tbody>
</table>

但是表中应该只有1个公司的isCompanyForCommunication = true 。 因此，当另一个复选框被选中时，我必须将所有其他公司设置为isCompanyForCommunication = false 。 因此，我在viewModel中创建了一个方法来取消选中所有其他公司。

    // Definition of Company
    var Company = function (crmAccountObject, contactId, companyForCommunicationId) {

        this.isCompanyForCommunication = ko.observable(false);
    }

    // Definition of the ViewModel
    var ViewModel = function () {
        var self = this;

        // ...

        // Lists
        this.companies = null; // This observableArray is set somewhere else

        // Events
        this.checkedNewCompanyForCommunication = function (company, event) {

            // Set all companies to False
            for (var i = 0; i < self.companies().length; i++) {
                self.companies()[i].isCompanyForCommunication = ko.observable(false);
            }

            // Set the "checked" company to TRUE
            company.isCompanyForCommunication = ko.observable(true);
            return true;
        }
    }

但是，所做的更改不会反映在HTML页面中。 所有其他复选框保持选中状态。

我在jsfiddle中创建了一个简单示例，以显示我想通过复选框确切实现的目标

有人知道我在做什么错吗？ 提前致谢！