103

モデルの値が変更されるたびに、(サーバーへのデータの保存などの) コードを自動的に実行するようなことをしたいとします。ng-changeモデルを変更する可能性のある各コントロールのようなものを設定することによってこれを行う唯一の方法はありますか?

つまり、ビューを使用すると、モデルが変更されると、明示的に何かを接続する必要なく、物事が正しく変更されます。サーバーに保存するコードを実行できることに類似したものはありますか? 何かのようなもの

myModel.on('change', function() {
  $.post("/my-url", ...);
});

バックボーンのようなもので見られるように。

4

3 に答える 3

152

および/または ng-modelを使用したビューでは、Angular が舞台裏で es を{{}}設定しています。$watch()

デフォルト$watchでは、参照によって比較します。3 番目のパラメーターを$watchに設定するとtrue、Angular は代わりにオブジェクトの変更を「浅く」監視します。配列の場合、これは配列項目を比較することを意味し、オブジェクト マップの場合、これはプロパティを監視することを意味します。したがって、これはあなたが望むことをするはずです:

$scope.$watch('myModel', function() { ... }, true);

更新: Angular v1.2 は、このための新しいメソッド`$watchCollection()を追加しました:

$scope.$watchCollection('myModel', function() { ... });

比較を説明するために「深い」ではなく「浅い」という言葉が使用されていることに注意してください。これは、参照が追跡されないためです。たとえば、監視対象のオブジェクトに別のオブジェクトへの参照であるプロパティ値が含まれている場合、その参照は追跡されません。他のオブジェクト。

于 2013-03-15T03:24:50.430 に答える
9

また、フォーム要素の状態 (変更された/変更されていない) に応じて動的にスタイルを設定する必要がある場合、または一部の値が実際に変更されたかどうかをテストする必要がある場合は、私が開発した次のモジュールを使用できます: https://github.com/betsol /angular-input-modified

追加のプロパティとメソッドをフォームとその子要素に追加します。これを使用すると、一部の要素に新しいデータが含まれているかどうかをテストしたり、フォーム全体に保存されていない新しいデータがあるかどうかをテストしたりできます。

次のウォッチを設定できます。$scope.$watch('myForm.modified', handler)フォーム要素に実際に新しいデータが含まれている場合、または初期状態に戻された場合にハンドラーが呼び出されます。

また、modified個々のフォーム要素のプロパティを使用して、AJAX 呼び出しを介してサーバーに送信されるデータの量を実際に減らすことができます。変更されていないデータを送信する必要はありません。

reset()おまけとして、フォームのメソッドへの呼び出しを介して、フォームを初期状態に戻すことができます。

モジュールのデモはこちらにあります: http://plnkr.co/edit/g2MDXv81OOBuGo6ORvdt?p=preview

乾杯！

于 2014-10-13T11:29:49.697 に答える