如何蓋ko.observable並將剩餘部分放入另一個字段

Question

我有一個ko.observable，名爲金額，存儲數值。我需要一種方法來限制特定上限的數值（上界數由ko.computed提供，在同一ViewModel中稱爲Max）。當用戶嘗試輸入的值時超過最大，我想借此超齡並將其應用到另一個ko.observable，稱爲超齡，也不允許金額的價值超過最大值。這如何實現？

Answer 1

您可能最有可能擴展您的可觀察性，具體取決於您嘗試實現的目標。這應該給你一個很好的方向（我沒有把它放進一個小提琴來測試它尚未） -

ko.extenders.overage = function(target, max) { 
    target.overage = ko.observable(); 
    var result = ko.computed({ 
     read: target, 
     write: function(newValue) { 
      var current = target(), 
       valueToWrite = newValue > max ? max : newValue 

      if (valueToWrite === max) { 
       target.overage(current - max); 
       target(valueToWrite); 
      } else { 
       target.notifySubscribers(valueToWrite); 
      } 
     } 
    }); 

    result(target()); 

    return result; 
}; 

function AppViewModel(one) { 
    this.myNumberOne = ko.observable(one).extend({ overage: 500 }); 
} 

ko.applyBindings(new AppViewModel(221.2234)); 

現在你觀察到的myNumberOne有一個針對設置在max任何額外金額稱爲overage擴展屬性當你擴展它（在這種情況下，500），myNumberOne的vlaue或你擴展的任何其他可觀察值將在500上限，並通過額外的超額。

在你看來，你可以使用這個像這樣 -

<span data-bind="text: myNumberOne"></span> 
<!-- ko if: myNumberOne().overage --> 
    Overage amount - <span data-bind="text: myNumberOne().overage"></span> 
<!-- /ko --> 

或

<span data-bind="text: myNumberOne"></span> 
<div data-bind="text: $data.myNumberOne().overage"></div> 

http://jsfiddle.net/DNxHu/

擴展它，並訂閱它，不使用計算機等...檢查小提琴