AngularJS には、スコープ変数を監視するディレクティブがあります。変数に特定のデータが含まれている場合は、その変数を少し変更する必要があります。問題は、変数を変更すると、my が$watch再度トリガーされることです。そのため、連続ループに陥ってしまいます。
scope.$watch('someVar', function(newValue, oldValue) {
console.log(newValue);
scope.someVar = [Do something with someVar];
});
これは$watch再びトリガーされ続けますが、それは理にかなっています。ただし、監視対象の変数を変更する方法が必要です。これを行う方法はありますか?
ベストアンサー1
を使用して変数の変更を監視する場合$scope.$watch、Angular は参照が変更されたかどうかを確認します。変更された場合は、ハンドラー$watchが実行され、ビューが更新されます。
$watch ハンドラー内でスコープ変数を変更する予定の場合、スコープ変数参照は呼び出されるたびに変更されるため、無限の $digest ループがトリガーされます。
無限ダイジェスト問題を回避するコツは保存するハンドラ内の参照$watchを使用して角度コピー（ドキュメント):
scope.$watch('someVar', function(newValue, oldValue) {
console.log(newValue);
var someVar = [Do something with someVar];
// angular copy will preserve the reference of $scope.someVar
// so it will not trigger another digest
angular.copy(someVar, $scope.someVar);
});
注意: このトリックはオブジェクト参照に対してのみ機能します。プリミティブでは機能しません。
一般的に、$watched変数をその$watchリスナー内で更新するのは良い考えではありません。ただし、避けられない場合もあります。