1. ホーム
  2. javascript

[解決済み] AngularJS : モデルの変更を自動的に検出する。

2022-12-08 12:15:31

質問

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

つまり、ビューでは、明示的に何かをフックすることなく、モデルが変更されると同時に、物事が変更されます。サーバーに保存するコードを実行できるような類似点がありますか?次のようなものです。

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

バックボーンのようなもので見ることができます。

どのように解決するのですか?

ビューで {{}} とか ng-model があるビューでは、Angular は $watch() を設定します。

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

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

更新 : Angular v1.2より、新しいメソッドが追加されました。 `$watchCollection() :

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

例えば、ウォッチされているオブジェクトが他のオブジェクトへの参照であるプロパティ値を含んでいる場合、他のオブジェクトを比較するためにその参照は追跡されないため、 "deep" ではなく "shallow" という言葉が比較を説明するために使われていることに注意してください。