チェックされたイベントにバインドする複数の関数

Question

このコードスニペットのようにKnockoutでチェックされたイベントに複数の関数をバインドすることはできますか？

コードスニペット：

<input type="radio" name="requestType" data-bind="value: id, checked: checkedRequestTypeId, isRequestTypeIdChecked" /> 
<script type="text/javascript"> 
    var viewModel = function() { 
     //... 
     checkedRequestTypeId = ko.observable(); 
     isRequestTypeIdChecked = function(){ 
      //some logic inside 
     } 
     //... 
    }; 

    ko.applyBindings(new viewModel()); 
</script> 

または私は一つだけの機能を結合して、この関数内で2つの異なる機能を呼び出すことができますか？

Answer 1

私はあなたの状況で、あなたはcheckedRequestTypeIdに従うことをサブスクライブ機能を使用することができると思います。

<input type="radio" name="requestType" data-bind="value: id, checked: checkedRequestTypeId, isRequestTypeIdChecked" /> 
<script type="text/javascript"> 
    var viewModel = function() { 
     //... 
     checkedRequestTypeId = ko.observable(); 

     this.checkedRequestTypeId.subscribe(function(){ 
      //some logic inside 
     } 

    }; 

    ko.applyBindings(new viewModel()); 
</script> 

私は私の答えはあなたに助けることができることを願っています。 詳細：http://knockoutjs.com/documentation/observables.html

Answer 2

いいえ、組み込みのcheckedバインディングではできません。本当に1つを書きたい場合はcustom binding handlerと書くことができます（再利用またはフォークを書く）が、同じようなものを手軽に得る方法があります。

書き込み可能な計算を使用することをお勧めします。いずれにしても、双方向バインディングビットをカプセル化する必要があります。別の言い方をすれば、checkedRequestTypeIdとisRequestTypeIdCheckedをプログラムで変更することはできません。そのような状況でチェックボックスをオンにするかどうかを決定する必要があります。

あなたはエッジケースのためのロジックの詳細を提供していないが、ここであなたが始めるために例を示します。

function ViewModel() { 
 
    var self = this; 
 
    
 
    self.checkedRequestTypeId = ko.observable(false); 
 
    self.isRequestTypeIdChecked = ko.observable(true); 
 
    
 
    self.requestTypeCheckedness = ko.computed({ 
 
    read: function() { 
 
     return self.checkedRequestTypeId() && self.isRequestTypeIdChecked() 
 
     ? "1" 
 
     : "2"; 
 
    }, 
 
    write: function(newVal) { 
 
     self.checkedRequestTypeId(newVal === "1"); 
 
     self.isRequestTypeIdChecked(newVal === "1"); 
 
    } 
 
    }); 
 
} 
 

 
ko.applyBindings(new ViewModel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 

 
<input type="radio" name="requestType" value="1" data-bind="checked: requestTypeCheckedness" /> 1 
 
<br> 
 
<input type="radio" name="requestType" value="2" data-bind="checked: requestTypeCheckedness" /> 2 
 

 
<hr> 
 
Debug info: <pre data-bind="text: ko.toJSON($root, null, 2)"></pre>

PSを。私はこれを解決する良い、代替方法としてStanislav Machel's solutionもサポートしています。どちらが最善かは文脈によって決まります。