如何订购淘汰赛的绑定？(How to order knockout bindings?)

我使用knockout.js。 我被困在一点点奇怪的情况（其很难解释，但我想，如果对不起我不清楚）。 我使用自定义绑定和选项单选择列表上结合：

  <select data-bind="options : arrayOfOptions, optionsText: 'Name', 
           optionsValue: 'Name', chosen: { }">
  </select>

ko.bindingHandlers.chosen = {
    init: function (element, valueAccessor, allBindingAccessor, 
                    viewModel, bindigContext) {
        var options = ko.utils.unwrapObservable(valueAccessor() || {});
        $(element).chosen(options);
    }
};

在这里，在运行时选择列表的将会从所有可用的选项填写arrayOfOptions阵列和chosen是自定义绑定在我申请一个CHOSEN PLUGIN上选择列表的。

现在我这里面临的问题是，在自定义绑定，当我申请当时的选择列表的未充满从选项中选择选择列表上的插件arrayOfOptions阵列。 是指在一个简单的项custom binding之前执行options binding 。 可以这样选择结合后绑定应用了自定义的人，请给我一个解决方案？

Answer 1:

将您的来电chosen到更新。

http://jsfiddle.net/jearles/avSfa/28/

-

ko.bindingHandlers.chosen = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        var allBindings = allBindingsAccessor();

        var options = {default: 'Select one...'};
        $.extend(options, allBindings.chosen)

        $(element).attr('data-placeholder', options.default);                
    },
    update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).chosen();
    }
};

-

另外，您也可以使用setTimeout移动呼叫chosen到执行队列的底部。 这将给淘汰赛选择绑定的时间做工作之前chosen尝试改变它。

ko.bindingHandlers.chosen = {
    init: function (element, valueAccessor, allBindingAccessor, 
                    viewModel, bindingContext) {
        var options = ko.utils.unwrapObservable(valueAccessor() || {});
        setTimeout(function() { $(element).chosen(options); }, 0);
    }
};

Answer 2:

创建一个属性与bindingHandler名称的数组此绑定依赖于后。

ko.bindingHandlers.chosen = { init: function (element, valueAccessor, allBindingAccessor, viewModel, bindigContext) { var options = ko.utils.unwrapObservable(valueAccessor() || {}); $(element).chosen(options); }, after:['options'] };

Answer 3:

ko.bindingHandlers.chosen = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    var options = allBindingsAccessor().options;

    options.subscribe(function (newValue) {
        $(element).chosen();
        $(element).trigger("chosen:updated");
    });

    var value = allBindingsAccessor().value;
    value.subscribe(function (newValue) {
        $(element).trigger("chosen:updated");
    });
},
update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    if (element.options.length > 0) {
        $(element).chosen();
        $(element).trigger("chosen:updated");
    }
}

};

这个工作对我KO JS 3.0

Answer 4:

虽然答案可能上面解决提出问题，他们似乎达不到有关自定义选择下拉菜单，例如通过使{“disable_search”：真正}禁用搜索。

我建议以下修改，允许通过选择定制您的约束力。

<select data-bind="options : arrayOfOptions, optionsText: 'Name', 
    optionsValue: 'Name', chosen: { 'disable_search': true }">
</select>

ko.bindingHandlers.chosen = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var options = allBindingsAccessor().options;
        var chosenOptions = allBindingsAccessor().chosen;

        options.subscribe(function (newValue) {
            $(element).chosen(chosenOptions);
            $(element).trigger("chosen:updated");
        });

        var value = allBindingsAccessor().value;
        value.subscribe(function (newValue) {
            $(element).trigger("chosen:updated");
        });
    },
    update: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        if (element.options.length > 0) {
            var chosenOptions = allBindingsAccessor().chosen;
            $(element).chosen(chosenOptions);
            $(element).trigger("chosen:updated");
        }
    }
};

文章来源: How to order knockout bindings?