Knockoutjs nie aktualizuje wartości, gdy zmieniono wybrane opcje.

Question

Problem występuje wtedy, gdy wybrane opcje zostały zmienione, wartość nie jest aktualizowana.

Kiedy więc zmieniam Hondę na Toyotę, opcje w drugim wyborze uległy zmianie, ale wybrano ModelMozelable not not. Musiałem coś przeoczyć.

JavaScript:

function ViewModel() { 
    var self = this; 

    self.selectedMake = ko.observable() 
    self.selectedModel = ko.observable() 

    self.makes = ["Honda", "Toyota"]; 
    self.models = ko.computed(function() { 
     if (self.selectedMake() === "Honda") return ["CRV", "Accord"]; 
     if (self.selectedMake() === "Toyota") return ["Rav4", "Camry"]; 
     return []; 
    }); 
} 
$(function() { 
    ko.applyBindings(new ViewModel()); 
}); 

HTML:

<select data-bind="value: selectedMake, options: makes"></select> 
<select data-bind="value: selectedModel, options: models"></select> 
<p>Selected make: <b data-bind="text:selectedMake"></b></p> 
<p>Selected model: <b data-bind="text:selectedModel"></b></p> 

JS Fiddle: http://jsfiddle.net/apuchkov/n4VyD/

Answer 1

Got odpowiedź na GitHub. Odśwież go tutaj, jeśli ktoś znajdzie to pytanie.

Jest to przypadek, w którym kolejność powiązań ma znaczenie. Zobacz http://knockoutjs.com/documentation/binding-syntax.html#notes_for_multiple_bindings_on_a_single_element

<select data-bind="options: makes, value: selectedMake"></select> 
<select data-bind="options: models, value: selectedModel"></select> 

jsFiddle: http://jsfiddle.net/n4VyD/4/

Answer 2

Nie jestem pewien, dlaczego to nie działa jak jest, ale jeśli założyć prenumeratę modele, można ręcznie zmienić wybrany model.

function ViewModel() { 
    var self = this; 

    self.selectedMake = ko.observable() 
    self.selectedModel = ko.observable() 

    self.makes = ["Honda", "Toyota"]; 
    self.models = ko.computed(function() { 
     if (self.selectedMake() === "Honda") return ["CRV", "Accord"]; 
     if (self.selectedMake() === "Toyota") return ["Rav4", "Camry"]; 
     return []; 
    }); 

    self.models.subscribe(function(value) { 
     self.selectedModel(value[0]); 
    }); 
} 

$(function() { 
    ko.applyBindings(new ViewModel()); 
}); 

Fiddle