淘汰赛禁用选择选项标题答案

【问题标题】：Knockout disable select option caption淘汰赛禁用选择选项标题
【发布时间】：2013-07-15 22:45:24
【问题描述】：

在淘汰赛 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);

            }
        });

    }
};

I've also created a fiddle here that shows the working version and non-working. 任何帮助将不胜感激！

【问题讨论】：

标签： javascript knockout.js html-select

【解决方案1】：

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

HTML

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

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

            }
        });
    }
};

【讨论】：