Question

我创建了一个js函数，用于切换对象（位于数组中）的属性的布尔值。总结一下我要做的事情，我有2个列表。一个列表显示项目是否布尔属性如果为真，则另一个列表将显示一个项目（因此切换功能）。

我的问题是当我将切换功能绑定到双击事件（正确触发，通过调试器验证）时，我似乎无法使绑定正确（或者可能完全是另一个问题）。如果我手动将切换功能与硬编码的“Id”值放在一起（确定将切换阵列中的哪个项目），则绑定可正常工作，并且该项目将显示在第二个列表中。

var TestNWJS = TestNWJS || {};

TestNWJS.QualificationList = (function () {

    //private functions
    function CreateQualificationModel(allCredentialsList) {
        TetsNWJS.QualificationList.ViewModel = {};
        TestNWJS.QualificationList.ViewModel.AllCredentials = ko.observableArray(allCredentialsList);

    }
    function toggleselected(allCredentialsList, id) {

        var credential = ko.utils.arrayFirst(allCredentialsList, function (credential) {
            var stringToInt = parseInt(id);
            return credential.Id === stringToInt;
        });

        if (credential.Selected == false) {
            credential.Selected = true;
        }
        else {
            credential.Selected = false;
        }

        return credential;
    }

    //public function
    return {
        Init: function (allCredentialsList) {

            CreateQualificationModel(allCredentialsList);
            toggleselected(allCredentialsList, 51); // THIS IS THE HARDCODED TEST, IT WORKS 


            //THIS IS WHAT I WANT TO WORK CORRECTLY:
            $("#allCredentials").live('dblclick', function (e) { 
                toggleselected(allCredentialsList, this.value);
            });

            ko.applyBindings(TetsNWJS.QualificationList.ViewModel);


        }
    }

})();

Answer 1

为了测试这个，我做了以下小提琴 -

http://jsfiddle.net/pwkad/uend52s5/

$("#container").on('dblclick', function (e) {
    console.log('double clicked it');
});

通过切换直播，它在最新版本的jQuery中为我工作

Answer 2

您是如何测试代码的？查看您发布的代码，看起来Selected属性的值正在以正确的方式更改。但是，它不是一个可观察的，所以你没有在屏幕上反映出结果。

尝试为每个凭证创建一个类，并创建一个可观察的“Selected”属性：

function Credential(id, selected)
{
   this.id = id;
   this.selected = ko.observable(selected);
}

TestNWJS.QualificationList.ViewModel.AllCredentials = ko.observableArray(allCredentialsList.map(function(item){ return new Credential(item.id, item.selected);}));

<强>更新

这是一个带有简单示例的codepen。有一个带有对象列表的视图模型，每个对象都有一个可观察的属性。还有第二个计算属性，它只过滤选定的项目：

http://codepen.io/adilsonjr/pen/yygxbg

双击事件后敲除绑定

2 个答案: