2013-07-17 7 views
7

Mit Knockout 2.3.0 wurde die optionsAfterRender Bindung eingeführt, so dass die Optionen sehr flexibel geändert werden können.Knockout deaktivieren Option auswählen Überschrift

Ich möchte die Optionen Untertitel deaktivieren. Im Moment mache ich

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

das funktioniert, aber ich habe zu kopieren und die optionsAfterRender Funktion überall. Ich habe versucht, einen benutzerdefinierten bindingHandler zu erstellen, um es an einem Ort zu tun, aber ich habe Schwierigkeiten. Das ist mein bindingHandler so weit:

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. Jede mögliche Hilfe würde geschätzt!

Antwort

3

Sie sollten alle Bindungen gelten zusammen, nicht Schritt für Schritt, wie folgt aus:

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

      } 
     }); 
    } 
};