敲除 - 在特定範圍內保持可觀察值

Question

我想限制可觀察到的敲除值能夠達到特定值的範圍的值。

var viewModel { 
     number : ko.observable(0); 
    } 



<input data-bind="value : number" /> 

有沒有一種方法，我可以限制處理，輸入到低於100例如正數？

Answer 1

截至目前，Knockout允許您按照解釋here所述在可觀察值上訂閱值更改事件。默認情況下，您可以分別訂閱change和beforeChange回調，但不能通過常見的回調。

圍繞subscribeChanged處理程序有處理程序，它在observable隨其新舊值更改之前通知回調函數。

從同一個Github線程中，我使用了一個subscribeChanged擴展器的實現。使用它，您可以在每次更改時驗證observable的值，並在不符合條件時將其重置爲原始值。

在下面的代碼片段，我比較觀察到的新值與定義的最大值，並重置可觀察到其舊的值，如果新的值大於100

ko.subscribable.fn.subscribeChanged = function (callback) { 
 
    var savedValue = this.peek(); 
 
    return this.subscribe(function (latestValue) { 
 
     var oldValue = savedValue; 
 
     savedValue = latestValue; 
 
     callback(latestValue, oldValue); 
 
    }); 
 
}; 
 

 
var model = function() { 
 
    var self= this; 
 
    self.number = ko.observable(0); 
 
    self.maxNumber = 100; 
 
    
 
    self.number.subscribeChanged(function(newValue, oldValue) { 
 
    if(newValue > self.maxNumber || // New value must not be larger than 100 
 
     (newValue != "" && parseFloat(newValue) != newValue)) { // New value must be a valid number 
 
     console.log('Rejecting value change.'); 
 
     self.number(oldValue); 
 
    } else { 
 
     console.log("Old: " + oldValue + ", New: " + newValue); 
 
    } 
 
    }); 
 
} 
 

 
ko.applyBindings(new model());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script> 
 
<input data-bind="textInput: number" />

---

_{1：有一個稍微不同的實現類似的擴展的位置： https://stackoverflow.com/a/18184016/5894241}