带有布尔值的敲除单选按钮绑定

问题描述：

按照此小提琴的操作，在您运行时创建的它不会将值绑定为"no蓝色"选项.

As per this Fiddle I created when you run it it does not bind the value to "no Blue" option as expected.

var viewModel = {    
    isBlue: ko.observable(false)
    //isBlue: ko.observable("false") this works
};

正如我在其中提到的那样，当我传递字符串值"false"时，它将进行绑定.很明显，敲除也可以进行类型比较.

As I have mentioned in there when I pass a string value "false" it does the binding. It's clear that knockout does type comparison as well.

在我的应用程序中，我正在使用komapper来创建视图模型.对于布尔型属性，它将创建布尔值并在布尔中初始化变量. 我需要将它们转换为字符串吗?在输入单选按钮元素中，我们将始终必须使用字符串值.我可以为复选框使用布尔值吗?

In my application I am using komapper which creates the view model. For properties in boolean it creates bool values and initialises variables in bool. Do I need to convert them to strings? In input radio button element we will always have to work with string values. Can I use a boolean value for checkboxes?

我尝试使用"checkedValue"仍然没有运气.

I tried with "checkedValue" still no luck.

答

我认为，您遇到的错误已在更高版本的淘汰赛中修复.

I think you're experiencing a bug that has been fixed in a later version of knockout.

它的工作方式(和您尝试过的一样):

The way it should work (and like you tried):

<input name="Test" type="radio" data-bind="checkedValue: true, 
                                           checked: isBlue" />Blue
<input name="Test" type="radio" data-bind="checkedValue: false, 
                                           checked: isBlue" />No Blue

ko.applyBindings({
  isBlue: ko.observable(false)
});

如果您包括剔除版本3.4，它会按预期工作:

If you include knockout version 3.4, it works as expected:

ko.applyBindings({
  isBlue: ko.observable(false)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script>

<label>
  <input name="Test" type="radio" data-bind="checkedValue: true, checked: isBlue" /> Blue
</label>
<label>
  <input name="Test" type="radio" data-bind="checkedValue: false, checked: isBlue" /> No Blue
</label>
<br />
<strong style="color: green">3.4.0: Does work</strong>

当您包括小提琴中使用的版本(2.1.0)时，它不会:

When you include the version you've used in the fiddle (2.1.0), it doesn't:

ko.applyBindings({
  isBlue: ko.observable(false)
});

<script src="https://cloud.github.com/downloads/knockout/knockout/knockout-2.1.0.js"></script>

<label>
  <input name="Test" type="radio" data-bind="checkedValue: true, checked: isBlue" />Blue
</label>
<label>
  <input name="Test" type="radio" data-bind="checkedValue: false, checked: isBlue" />No Blue
</label>
<br />
<strong style="color: red">2.1.0: Does not work</strong>

:经过更多挖掘:我认为这不是2.1.0中的错误； checkedValue当时甚至还不存在！

after some more digging: I don't think it's a bug in 2.1.0; the checkedValue didn't even exist at that point!

查看源代码，您会发现在2.1.0和更高版本之间获取检查值的逻辑非常不同:

Looking at the source you notice the logic for getting the checked value is very different between 2.1.0 and later versions:

在2.1.0版中:

if (element.type == "checkbox") {
  valueToWrite = element.checked;
} else if ((element.type == "radio") && (element.checked)) {
  valueToWrite = element.value;
}

在3.4.0版中:

 var checkedValue = ko.pureComputed(function() {
   // Treat "value" like "checkedValue" when it is included with "checked" binding
   if (allBindings['has']('checkedValue')) {
     return ko.utils.unwrapObservable(allBindings.get('checkedValue'));
   } else if (allBindings['has']('value')) {
     return ko.utils.unwrapObservable(allBindings.get('value'));
   }

  return element.value;
});

一个明确的答案是:更新到3.4.0，或创建实现3.4.0行为的自定义检查绑定(如果版本更新会破坏您的项目)

带有布尔值的敲除单选按钮绑定

相关推荐