如何更改subscribe函数内的observable值?
例如
JS型号:
function Model(){
self = this;
self.Test = ko.observable(2);
self.Test.subscribe(function (){
if (/**Some bool expression**/) {
self.Test(2);
}
});
}
HTML:
<input type="radio" value="1" data-bind="checked:Test" />
<input type="radio" value="2" data-bind="checked:Test" />
<input type="radio" value="3" data-bind="checked:Test" />
默认情况下,检查第二个无线电输入点击第一个收音机后,第一个和第二个都被选中.
更新:
当我同时包含jQuery和knockout时会发生这种情况.如果删除jquery,那么一切都好.
但它只是测试页面.在实际项目中,我需要在某些地方使用jQuery,在这种情况下我无法删除它.
Sample.
测试页面来源:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="knockout-2.1.0.js"></script>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript">
function Model(){
self = this;
self.Test = ko.observable(2);
self.Test.subscribe(function (){
if (true) {
self.Test(2);
}
});
}
</script>
</head>
<body>
<input type="radio" value="1" data-bind="checked:Test" />
<input type="radio" value="2" data-bind="checked:Test" />
<input type="radio" value="3" data-bind="checked:Test" />
</body>
<script type='text/javascript'>
ko.applyBindings(new Model());
</script>
</html>
解决方法:
更新(2015-02-27):从Knockout 3.1.0开始,Knockout不包含click事件的任何“变通方法”代码,并且在处理问题中的示例时应该没有问题. http://jsfiddle.net/9S96U/3/
当包含jQuery时,Knockout使用它来处理事件,包括用于响应单选按钮的click事件.它包含一些“解决方法”代码,以确保单击处理程序看到单选按钮的正确选中状态,但这似乎会干扰尝试重置中间检查值的代码.
解决方案是使用setTimeout更新值.这种方式在点击处理程序完成后发生.
function Model(){
var self = this;
self.Test = ko.observable(2);
self.Test.subscribe(function (){
setTimeout(function() {
self.Test(2);
});
});
}
示例:http://jsfiddle.net/9S96U/1/
你还需要在self = this之前包含var,这样你就不会覆盖window.self.