JSViews вычисляется наблюдаемый, связанный с <select>, не обновляющийся с .set()

Question

Я пытаюсь связать поле <select> с вычисленным наблюдаемым объектом в JSViews. <select> обновляется отлично, когда изменяется зависящая от переменной переменная. Однако при выборе нового значения в поле <select> он не вызывает функцию set(), которую я определил. См https://jsfiddle.net/4y274h0L/3/

Шаблон

<select> 
    {{for options}} 
     <option value="{{:#data}}" data-link="{:#data} selected{:~root.computedSelectedOption() == #data}"></option> 
    {{/for}} 
</select> 

Компьютерная наблюдаемым

function privateComputedOption() { 
    return vm.tempSelectedOption; 
} 

privateComputedOption.depends = ["~root.tempSelectedOption"]; 

privateComputedOption.set = function(val) { 
    $.observable(vm).setProperty("tempSelectedOption", val); 
    console.log(val); 
}; 

Любая помощь будет очень кстати!

Answer 1

На самом деле вы не привязывали данные к выбранному для вычисленного наблюдаемого. Для двусторонних привязок это привязка к элементу, который вызовет сеттер, когда пользователь изменит раскрывающийся список.

<select data-link="computedSelectedOption()"> 
    {{for options}} 
    <option value="{{:#data}}" 
    data-link="{:#data} selected{:~root.computedSelectedOption()==#data}"> 
    </option> 
    {{/for}} 
</select> 

{^{:computedSelectedOption()}} 

Я обновил jsfiddle, как описано выше:

https://jsfiddle.net/4y274h0L/4/

Смотрите, например http://www.jsviews.com/#samples/form-els/array-binding.

BTW в следующем обновлении вещей JsViews будет упрощен, и вам не понадобится привязка данных к selected{:~root.computedSelectedOption()==#data}" по параметрам. Достаточно только канала данных по выбору <select data-link="computedSelectedOption()">.