2017-12-22 41 views
1

클릭 이벤트 후 첫 번째 또는 두 번째 텍스트를 업데이트하고 싶습니다. 입력 필드에서 초점을 맞추면 업데이트됩니다.KnockoutJS - 클릭 이벤트 후 데이터 바인딩

여기에 a link입니다.

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

알겠습니다. 고맙습니다. – siuri

답변

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.