如何订购基因敲除绑定？

Question

我正在使用knockout.js。我陷入了一个有点奇怪的情况(这很难解释，但我正在努力，如果我不清楚，很抱歉)。我在一个select-list上使用了自定义绑定和选项绑定：

  <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);
    }
};

在这里，在运行时，selectlist将填充来自arrayOfOptions数组的所有可用选项，而chosen是一个自定义绑定，我在其中对select-list应用了一个CHOSEN PLUGIN。

现在我面临的问题是，在自定义绑定中，当我在选择列表上应用choose plugin时，arrayOfOptions数组中的选项并没有填充到选择列表中。简单地说，意思是在options binding之前执行custom 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的调用移到执行队列的底部。这将为Knockout选项提供绑定时间，以便在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名称数组创建一个after属性。

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很有效