Knockout.js 删除基于模型的值绑定

我有一个模型属性，它有时应该绑定到

输入

元素，有时绑定到基于配置的

选择

元素。
我在两个元素上使用值绑定，并使用可见绑定隐藏其中一个元素

由于两个绑定都在页面上，当

输入可见时，当我输入一些隐藏的
选择中不存在的文本时，我无法更改其值。因此，如果
input
元素可见（
isDropdown
为false），我不希望绑定
select
（或者是否有其他更好的方法来处理此问题？）

示例Javascript模型

var player = function (name, age, country, isDropdown) {
    this.name = ko.observable(name);
    this.age = ko.observable(age);
    this.country = ko.observable(country);
    this.isDropdown = ko.observable(isDropdown);
};

var playerModel = function () {
    var self = this;
    self.myPlayer = new player('Murray', 28, 'UK', false);
    //self.myPlayer = new player('Murray', 28, 'UK', true);
    self.countryList = ['US', 'UK', 'SWISS'];   
}
var model = new playerModel();
ko.applyBindings(model);

HTML代码

    Name:
<input type="text" data-bind="value: myPlayer.name" />
<br/>Age:
<input type="text" data-bind="value: myPlayer.age" />
<br/>Country:
<input type="text" data-bind="value: myPlayer.country, visible: !(myPlayer.isDropdown())" />
<select data-bind="options: $root.countryList, 
    value:myPlayer.country, 
    optionsCaption:'Choose..',        
    visible: myPlayer.isDropdown()"></select>
<br/>
(There is a dropdown / input which is hidden, please swap the commented lines in javascript model to enable that )

名称：

年龄：

国家：


（有一个隐藏的下拉列表/输入，请交换javascript模型中的注释行以启用该选项）

相应的JS Fiddle使用虚拟的
if
绑定。当
isDropdown
为
false
时，这将防止数据绑定select元素位于DOM中并被绑定

<!-- ko ifnot: myPlayer.isDropdown -->
    <input type="text" data-bind="value: myPlayer.country" />
<!-- /ko -->
<!-- ko if: myPlayer.isDropdown -->
    <select data-bind="options: $root.countryList, 
        value:myPlayer.country, 
        optionsCaption:'Choose..'">
    </select>
<!-- /ko -->



@xdumain谢谢。要学的东西很多。。。