我有以下javascript代码
function AppViewModel(){
this.myValue = ko.observable().extend({ minNumber: "5"}).extend({ maxNumber: "20" });
}
ko.extenders.minNumber = function(target, minValue){
target.hasError = ko.observable();
target.errorMessage = ko.observable();
function validate(newValue){
target.hasError(parseInt(newValue) < parseInt(minValue) ? true : false);
target.errorMessage(parseInt(newValue) < parseInt(minValue) ? "MinVal" : "");
}
validate(target());
target.subscribe(validate);
return target;
};
ko.extenders.maxNumber = function(target, maxValue){
target.hasError = ko.observable();
target.errorMessage = ko.observable();
function validate(newValue){
target.hasError(parseInt(newValue) > parseInt(maxValue) ? true : false);
target.hasError(parseInt(newValue) > parseInt(maxValue) ? "MaxVal" : "");
}
validate(target());
target.subscribe(validate);
return target;
};
ko.applyBindings(new AppViewModel());
以及以下HTML
<input data-bind="value: myValue, valueUpdate: 'afterkeydown'"/><br/>
<span data-bind="text: myValue"></span>
<span data-bind="text: myValue.errorMessage"></span>
<span data-bind="text: myValue.hasError"></span>
我想要实现的是对具有最小和最大整数值的observable进行验证。我的代码工作http://jsfiddle.net/Gazzo100uk/nCtpx/5/但我不确定为什么它的工作原理为什么maxNumber不清除其validate函数中的errorMessage属性,即使整数在这个例子中小于5,反之亦然。
这些功能会以什么顺序被解雇?
就像我说的那样,它做了我想做的事,但我不明白它是如何工作的,说实话,我从没想过它会起作用。
请有人放光吗?
此致 加里
答案 0 :(得分:1)
我认为导致它“正常工作”的主要问题是您没有在errorMessage
扩展程序中设置maxNumber
,因此未对其进行不当清除:
function validate(newValue){
target.hasError(parseInt(newValue) > parseInt(maxValue) ? true : false);
target.hasError(parseInt(newValue) > parseInt(maxValue) ? "MaxVal" : "");
}