我有以下代码：

模型.js

class MyModel {
    constructor(value, title) {
        this.value = ko.observable(value);
        this.title = ko.observable(title);
    }
}

class MyWrapper {
    constructor(selected_model) {
        this.selected_model = ko.observable(selected_model);
    }
}

查看模型.js

class MyVM {
    constructor() {
        let items = [
            new MyModel(1, 'One'),
            new MyModel(2, 'Two'),
            new MyModel(3, 'Three')
        ];

        this.object_to_work_with = ko.observable(new MyWrapper(items[1]));
        this.my_list = ko.observableArray(items);
    }
}

html模板

<div data-bind="with: object_to_work_with">
    <select id="my_list" data-bind="options: $root.my_list,
                                    optionsValue: 'value',
                                    optionsText: 'title'
                                    value: selected_model().value"></select>
</div>

现在问题来了。一开始我认为值应该直接为selected_model：

<div data-bind="with: object_to_work_with">
    <select id="my_list" data-bind="options: $root.my_list,
                                    optionsValue: 'value',
                                    optionsText: 'title'
                                    value: selected_model"></select>
</div>

但这不起作用，它会导致错误，如“undefined has no property 'value'”。所以我尝试了value: selected_model()，现在它起作用了，并选择了正确的值，但作为literal -〉，如果我更改它，object_to_work_with.selected_model()不会更改。最后一次尝试是value: selected_model().value，它似乎起作用了，但现在当我选择另一个值时，它不会更改object_to_work_with.selected_model()，它只改变选定模型的值，我是说这个object_to_work_with.selected_model().value() => <the value I've selected>，但是object_to_work_with.selected_model().title() => 'Two'永远不会改变。
我在寻找一个解决方案很长时间了，我不知道如何解决它。根据manual，它看起来应该是value: selected_model，但它导致了异常，我不知道我做错了什么。
有什么想法吗？
编辑：而且最后一个选项value: selected_model().value正在改变my_list中的项的值，因为它当然只是一个参考。
编辑2：这里我已经创建了一个工作演示-https://jsfiddle.net/L7tsy4ae/。