如何订购淘汰赛绑定?

use*_*381 7 javascript jquery knockout.js

我正在使用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);
    }
};
Run Code Online (Sandbox Code Playgroud)

在运行时,selectlist将填充arrayOfOptions数组中的所有可用选项,并且chosen是一个自定义绑定,我在选择列表中应用CHOSEN PLUGIN.

现在我面临的问题是,当我在选择列表上选择插件时,在自定义绑定中,选择列表没有填充arrayOfOptions数组中的选项.意味着在简单的术语custom binding中执行之前options binding.有人可以给我一个解决方案,以便在选项绑定后应用自定义绑定吗?

DrS*_*myD 10

使用此绑定所依赖的bindingHandler名称数组创建一个after属性.

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

  • 这是[jsfiddle](http://jsfiddle.net/2uaLxdrk/).`['options']`是一个bindingHandler名称列表,它将检查当前数据绑定是否包含任何这些名称,它将推迟到绑定之后.你是对的,它不是在文档中,我在源代码中找到它. (3认同)

Joh*_*les 5

将您的呼叫转移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();
    }
};
Run Code Online (Sandbox Code Playgroud)

-

或者,您可以使用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);
    }
};
Run Code Online (Sandbox Code Playgroud)