0

KOJS モデルにバインドされたチェックボックスがあります。

<input type="checkbox" data-bind="checked:settings.remember">

ユーザーがチェックボックスの値を変更したときにデータベースを更新しようとしています。ただし、ビューモデルは次の jQuery 関数の後に更新されます。

$("input[type='checkbox']").click(function(){ });

$("input[type='checkbox']").change(function(){ });

$("input[type='checkbox']").mouseup(function(){ });

別の言い方をすれば、これらの関数内の viewModel を覗くと、ユーザーが変更する前のチェックボックスの値が返されます。したがって、チェックボックスが一度 true で、現在は false (および false として表示) になっている場合、viewModel は引き続き true と表示されます。

バインディングが発生した後に発生する可能性がある、使用できる他の jQuery 関数はありますか? または、viewModel 変数が変更された後に関数を呼び出す他の賢い方法を考えられますか? 私の現在のviewModel宣言は次のとおりです。

var viewModel = {};
//...get some data from AJAX calls
ko.mapping.fromJSON(data, viewModel.'+file+');

file は動的な値です (複数のデータベースから viewModel を描画します)

上記の問題は、以下のハックなソリューションで解決できますが (私の回答を参照)、RP Niemeyer の回答は、手動サブスクリプションを使用するより良い方法があることを示唆しています。これまでのところ、マッピング プラグインを使用して、viewModel 内で物事を定義する方法を理解できていません。

これまでのコードは次のとおりですが、もちろん、JSFiddle では機能しません。

4

2 に答える 2

2

一般に、このタイプのものの良い選択は、ビューモデル自体でそれを処理することです。たとえば、 (監視可能な場合)に対して手動サブスクリプションsettings.rememberを使用して、データベース呼び出しをトリガーできます。

settings = {
  remember: ko.observable(false)
};

settings.remember.subscribe(function(newValue) {
    //run your logic here
}, settings);

呼び出しの2番目の引数は、関数が実行されるときsubscribeの値を決定します。this

Knockoutの外部で変更するフィールドと実際に対話する必要がある場合は、「変更」ハンドラーをフックする必要がありますが、ko.applyBindingsが呼び出されるまでは接続しません。次に、変更イベントハンドラーは、Knockoutが既に要素に追加した変更ハンドラーの後に実行されます。ただし、コンテンツがテンプレート内にあり、再レンダリングされると、ハンドラーが失われます。

手動サブスクリプションアプローチを使用することを強くお勧めします。

于 2012-12-27T18:20:02.983 に答える
0

上記のRP Niemeyerの答えはこれよりもはるかに優れているかもしれませんが、ここに私の問題を解決した一時的な修正があります:

$("input[type='checkbox']").click(function() {
  viewModel.settings.remember($(this).is(":checked"));';
  //...AJAX it away
});
于 2012-12-27T18:25:08.990 に答える