KnockOut.js文本绑定客户端更改未更新ViewModel

Question

我在更改后有两个下拉菜单会更新标签。 使用文本绑定将标签绑定到我的viewModel中的一个可观察字段。 但是，更改标签文本时，不会更新提交给服务器的viewModel。 我无法从淘汰赛网站上找到相关信息。 我想念什么吗？

的HTML

       <select class="string-match-dropdown">
            <option value="*">contains</option>
            <option value="^">starts with</option>
            <option value="$">ends with</option>
            <option value="=">is exactly</option>
            <option value="@@">has value</option>
        </select>
        <select class="date-money-match-dropdown">
            <option value="eq">=</option>
            <option value="noteq"><></option>
            <option value="gt">></option>
            <option value="gteq">>=</option>
            <option value="lt"><</option>
            <option value="lteq">&lt;=</option>
        </select>
        <label class="match-label" data-bind='html: qualifier'></label>

JS

$('.date-money-match-dropdown').live('change', function () {
    $(this).parent().find('.match-label').html($(this).find('option:selected').text());
});

$('.string-match-dropdown').live('change', function () {
    $(this).parent().find('.match-label').html($(this).find('option:selected').text());
});

Answer 1

对于这种情况，您根本不需要使用jquery。

因为您的viewmodel qualifier上已经有一个可观察的对象，所以只需要在select上使用value绑定 ，并且Knockout将为您进行更改处理：

<select class="string-match-dropdown" data-bind='value: qualifier'>
    <option value="*">contains</option>
    <option value="^">starts with</option>
    <option value="$">ends with</option>
    <option value="=">is exactly</option>
    <option value="@@">has value</option>
</select>
<select class="date-money-match-dropdown" data-bind='value: qualifier'>
    <option value="eq">=</option>
    <option value="noteq"><></option>
    <option value="gt">></option>
    <option value="gteq">>=</option>
    <option value="lt"><</option>
    <option value="lteq">&lt;=</option>
</select>
<label class="match-label" data-bind='html: qualifier'></label>

演示JSFiddle。