ユーザーが行っていない変更を無視する方法はありますか？

Question

私はview.modelにko.observableを持っています。これは入力に添付されています。ユーザーがその入力値（文字単位）を変更すると、AJAX呼び出しが実行され、バックエンドから提案がダウンロードされます。

ユーザーが提案のいずれかを選択すると、入力値を入力値に入力したいが、AJAX呼び出しを送信しないでください。しかし、observableの値を設定すると、イベントと呼び出し関数が呼び出され、textInputバインディングに接続されます。

textInputをトリガーせずに観測値の値を設定するにはどうすればよいですか？

サンプルコード：選択が行われ、フィールドはCSSクラスを持っているかどうかを確認するためにAJAX呼び出しの周りにいくつかのロジックを入れた後

var name = ko.observable(); 
name.subscribe(nameChanged); 

var nameChanged = function() { 
    someService.post(name(), success, failure); 
} 

var someAction = function() { 

    name("Test"); // I don't want to trigger AJAX call here 
} 

<input type="text" data-bind="textInput: name" /> 

Answer 1

別のオプションは、仲介として計算、観察を使用することです。 Ajax関数は、オブザーバブルへの直接書き込みがそれをバイパスするように、計算されたイベントの書き込みイベントでトリガできます。

function viewModel(){ 
 
    var self = this; 
 
    
 
    self.realName = ko.observable('test'); 
 
    
 
    self.Name = ko.computed({ 
 
     read: function(){ 
 
      return self.realName(); 
 
     }, 
 
     write: function(value){ 
 
      self.realName(value); 
 
      nameChanged(value); 
 
     } 
 
    }); 
 
    
 
    function nameChanged(newName) { 
 
     console.log("name changed:", newName); 
 
    } 
 
    
 
    self.modifyName = function(){ 
 
     self.realName(self.realName() + 'z'); 
 
    } 
 
} 
 

 
ko.applyBindings(new viewModel());

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

 

 
<input type="text" data-bind="textInput: Name" /> 
 
<br /> 
 
<button data-bind="click: modifyName">Modify</button>

Answer 2

はたぶん、フィールド上の特定のCSSクラスを設定します。

Answer 3

observableのchangeイベントにサブスクライブする代わりに、あなたのajaxコールをuiエレメントのchangeイベントに結びつけることができます。あなたはname.subscribe(nameChanged);を取り除くとevent結合追加になるだろう：作品

data-bind="textInput: name, event: { changed: nameChanged }" 

Answer 4

を「旧式」の道を、本当にエレガントではありませんが、一時的にサブスクリプションを配置し、それを再接続することです：

var myName = ko.observable(); 
 
var nameSub = myName.subscribe(nameChanged); 
 

 
function nameChanged(newName) { 
 
    console.log("name changed:", newName); 
 
} 
 

 
function changeWithoutLog() { 
 
    nameSub.dispose(); 
 
    myName("Test"); 
 
    nameSub = myName.subscribe(nameChanged); 
 
} 
 

 

 
ko.applyBindings({ name: myName });

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

 

 
<input type="text" data-bind="textInput: name" /> 
 
<button data-bind="click: changeWithoutLog">change without post</button>