Knockoutjs Dropdown Pre Selection in Nested Arbitary Javascript Object Working Fine KO 2x версии Не работает в версиях KO 3x

Question

поэтому это мои данные образца. которые будут загружать сервер форм в json-формате в нижележащий график objec. Его массив «Выбор» объекты будут иметь id, наименования, этапы & currentStageId Недвижимость. «этапы» собственности в «Выбор» объекта является массивом «Stage» объекта, который будет имеющими идентификатора, имя & значения properties.The объекта «Выбор» будет проходить через No.of этапов от «Первый этап» на «Четвертый этап», чтобы пользователь мог выбрать «Сцена» из раскрывающегося списка «Предоставление» и сохранить его. «currentStageId» этого свойство, которое хранит «идентификатор» объект этапа, который даст в какой стадии соответствующего объект «Выбор» в

Примечания: каждый выбор может иметь различные типы этапов для краткости простой, насколько это возможно

т.е. для выбора 1 тока сохранены стадии является 4

var data = [ 
new Choice({ 
    id: 1, 
    name: "One", 
    stages: [ 
    new Stage({ 
     id: 1, 
     name: "First Stage", 
     value: 25 
    }), 
    new Stage({ 
     id: 2, 
     name: "Second Stage", 
     value: 50 
    }), 
    new Stage({ 
     id: 3, 
     name: "Third Stage", 
     value: 75 
    }), 
    new Stage({ 
     id: 4, 
     name: "Fourth Stage", 
     value: 100 
    })], 
    currentStageId: 4 

}), 
new Choice({ 
    id: 2, 
    name: "Two", 
    stages: [ 
    new Stage({ 
     id: 1, 
     name: "First Stage", 
     value: 25 
    }), 
    new Stage({ 
     id: 2, 
     name: "Second Stage", 
     value: 50 
    }), 
    new Stage({ 
     id: 3, 
     name: "Third Stage", 
     value: 75 
    }), 
    new Stage({ 
     id: 4, 
     name: "Fourth Stage", 
     value: 100 
    })], 
    currentStageId: 3 

}), 
new Choice({ 
    id: 3, 
    name: "Three", 
    stages: [ 
    new Stage({ 
     id: 1, 
     name: "First Stage", 
     value: 25 
    }), 
    new Stage({ 
     id: 2, 
     name: "Second Stage", 
     value: 50 
    }), 
    new Stage({ 
     id: 3, 
     name: "Third Stage", 
     value: 75 
    }), 
    new Stage({ 
     id: 4, 
     name: "Fourth Stage", 
     value: 100 
    })], 
    currentStageId: 2 

})]; 

Вот "Выбор" & "Stage" Modles для хранения данных и ViewModel для связывания

function ViewModel(data) { 
    var self = this; 
    self.choices = ko.observableArray(data); 
    //dont require pre selection so kept it with empty observable so it 
    //will be set to first item in the dropdown list 
    self.selectedChoice = ko.observable(); 
} 

function Choice(data) { 
    //debugger; 
    this.id = data.id; 
    this.name = data.name; 
    //require pre selection of stage as choice can go through no of 
    //stages and selected stage name and value will be stored 
    this.selectedStage = ko.observable(ko.utils.arrayFirst(data.stages, function (item) { 
     return item.id === data.currentStageId; 
    })); 
    this.stages = ko.observableArray(data.stages); 

} 

function Stage(data) { 
    this.id = data.id; 
    this.name = data.name; 
    this.value = data.value; 
} 
ko.applyBindings(new ViewModel(data)); 

Вот мой взгляд

<select data-bind="options: choices, optionsText: 'name', value: selectedChoice"></select> 
<select data-bind="options: selectedChoice().stages, optionsText: 'name', value: selectedChoice().selectedStage"></select> 

Knockout.js 2x версия

1. Pre Выбор сохраненного этапа работает
2. Выбранный этап для выбора обновляется в базовом наблюдаемом

Вот Working sample with KO 2x в JS

Knockout.js 3X версии

1. Pre Выбор сохраненной сцены не работает
2. Selected основу для выбора не сохраняется. Когда выбор изменен, selectedStage устанавливается в первый элемент в раскрывающемся списке каждый раз, когда выбор изменяется.

Вот Working sample with KO 3x

Наконец фактическая часть. Вопрос!

1. Почему одинаковый код ведет себя по-разному с двумя разными версиями КО. Я пропустил что-то новое в нокауте? или это ошибка в КО?
2. Какие изменения кода должны быть выполнены для обеспечения такой же функциональности, как в случае с поздней версией KO, с использованием последней версии KO?потому что мой проект разрабатывается с последней версией konckout.js 3.1.0, и я не хочу возвращаться к старой версии для этой функции.
3. Какое поведение версии KO правильно, 2x или 3x? Что происходит внутри страны? что вызывает расхождения в этом поведении?

Заранее спасибо.

Answer 1

Я думаю, что это связано с 2. Bindings are now refreshed independently
Теперь вы должны использовать selectedChoice движение из options связывания, например,

<div data-bind="with: selectedChoice"> 
    <select data-bind="options: stages, optionsText: 'name', value: selectedStage"></select> 
</div>