knockout.js - サーバーの応答を 1 回表示して、knockout.js の最初のイベントの後にクリアするにはどうすればよいですか?

Question

ajax投稿の後、「ご注文を受け取りました：リンク」を表示したいと思います。ユーザーの最初の操作 (viewModel の変更) の後、メッセージをクリアしたいと思います。

ノックアウト.jsでそれを行うにはどうすればよいですか

意見：

<div data-bind="text:serverResponse,visible:serverResponseActive"></div>

多分書き込み可能な計算されたオブザーバブル？どのように？

Answer 1

試すことができるアプローチの 1 つはevent、サーバー メッセージをクリアしたいクライアントと対話可能な要素にバインディングを追加することです。したがって、次のようなものです：

<input type="text" data-bind="event: { mouseover: clearResposne, click: clearResponse}" />

// viewmodel code (object literal style)
clearResponse: function() { this.serverResponseActive = false; },

大きなページでは少し乱雑になる可能性がありますが、1 つまたは 2 つのことについては、かなりすっきりとコンパクトになります。

別のアプローチは、x 秒でフラグをクリアするサーバー応答を受信したときにタイムアウトを設定することです。

// In the view model (constructed object style)
var self = this; // to un-confuse the closure function 'this'

// In the ajax response
setTimeout(function() { self.serverResponseActive = false }, 5000);

ユーザー アクション後の遅延のために 2 つを組み合わせます。

編集：あなたに触発された3番目のアプローチ

ユーザーの最初の操作 (viewModel の変更) の後、メッセージをクリアしたいと思います。

viewModel 内の他のすべてのオブザーバブルを手動でサブスクライブします。たくさんのオブザーバブルがある場合、非常に面倒になる可能性があります。

myViewModel.personName.subscribe(function(newValue) {
    setTimeout(function() { self.serverResponseActive = false }, 5000);
});

オブザーバブルが本当にたくさんある場合は、サブスクリプション/タイムアウトが組み込まれたカスタム バインディングを作成することを検討してください。