KnockoutJS - クリックイベント後のデータバインディング

Question

クリックイベント後の最初の＃または2番目のテキストを更新したいと思います。 入力フィールドにフォーカスを当てると更新されます。

ここにはa linkです。

function ViewModel() { 
    self.this; 
    self.var1 = ko.observable(50); 
    self.var2 = ko.observable(60); 
.... 
} 
var vm = new ViewModel(); 
ko.applyBindings(vm); 

Answer 1

観測を使用しての全体のポイントは、あなたのための変更を追跡することです：など

例えば入力を変更するテキストの変更あなたは、いくつかの一時を使用する必要があり、この自動追尾したくない場合入力値を保存し、クリックイベントに手動で観測を変更するには、変数：

function ViewModel() { 
    var self = this; 
    self.var1 = ko.observable(50); 
    self.var2 = ko.observable(60); 
    self.temp1 = ko.observable(self.var1()) 
    self.temp2 = ko.observable(self.var2()) 

    this.addition = function() { 
    self.var1(Number(self.temp1())); 
    self.var2(Number(self.temp2())); 

    this.var3 = self.var1() + self.var2(); 
    alert("Addition is = " + this.var3); 
    }; 
}; 

そして、これらの一時変数にご入力フィールドをバインドします

<p>First #: <span data-bind="text: var1"> </span></p> 
<p>Sectond #: <span data-bind="text: var2"> </span></p> 

<p>Enter first #: 
    <input data-bind="value: temp1" /> 
</p> 
<p>Enter second #: 
    <input data-bind="value: temp2" /> 
</p> 
<p> 

<button type="submit" data-bind="click: addition">Click here for addition</button> 
</p> 

デモ：JSFiddle。