javascript - 淘汰赛禁用选择选项标题

Question

在淘汰赛 2.3.0 中optionsAfterRender引入了绑定，以便可以非常灵活地更改选项。

我想禁用选项标题。目前我正在做

<select data-bind="options: items, optionsCaption:'please select', optionsAfterRender: function(option, item) { ko.applyBindingsToNode(option, {disable: !item}, item); }"></select>

这有效，但我必须在optionsAfterRender任何地方复制和粘贴该功能。我一直在尝试创建一个自定义 bindingHandler 来在一个地方完成它，但我遇到了困难。到目前为止，这是我的 bindingHandler：

ko.bindingHandlers.disableOptionsCaption = {
    init: function (element) {

        ko.applyBindingsToNode(element, {
            optionsAfterRender: function (option, item) {

                ko.applyBindingsToNode(option, {
                    disable: !item
                }, item);

            }
        });

    }
};

我还在这里创建了一个小提琴，显示工作版本和非工作版本。任何帮助，将不胜感激！

Answer 1

您应该将所有绑定一起应用，而不是逐步应用，如下所示：

html

<select data-bind="disableOptionsCaption:{}"></select>  

JS

ko.bindingHandlers.disableOptionsCaption = {
    init: function (element,valueAccessor, allBindingsAccessor, viewModel) {

        ko.applyBindingsToNode(element, {
            options: viewModel.items,
            optionsCaption: 'please select',
            optionsAfterRender: function (option, item) {

                ko.applyBindingsToNode(option, {
                    disable: !item
                }, item);

            }
        });
    }
};