AngularJS：清除$ watch

Question

我的AngularJS应用程序中有一个监视功能。

$scope.$watch('quartzCrystal', function () {
   ...
}

然而，在某些条件之后（在我的例子中，更改我single-page application处的页面）我想要停止该监视（就像清除超时一样）。

我该怎么做？

Answer 1

$watch返回注销功能。调用它将取消注册$watcher。

var listener = $scope.$watch("quartz", function () {});
// ...
listener(); // Would clear the watch

Answer 2

范围。$ watch返回一个可以调用的函数，该函数将取消注册该手表。

类似的东西：

var unbindWatch = $scope.$watch("myvariable", function() {
    //...
});

setTimeout(function() {
    unbindWatch();
}, 1000);

Answer 3

如果您想在发生某些事情后立即清除它，您也可以清除回调中的手表。这样你的$ watch将一直保持活跃状态​​直到使用。

像这样...

var clearWatch = $scope.$watch('quartzCrystal', function( crystal ){
  if( isQuartz( crystal )){
    // do something special and then stop watching!
    clearWatch();
  }else{
    // maybe do something special but keep watching!
  } 
}

Answer 4

有些时候你的$ watch正在调用dynamically并且它会创建它的实例，所以你必须在$watch函数之前调用注销功能

if(myWatchFun)
  myWatchFun(); // it will destroy your previous $watch if any exist
myWatchFun = $scope.$watch("abc", function () {});

Answer 5

如果你有太多的观察者，你需要清除所有这些，你可以将它们推入一个数组并在循环中销毁每个$watch。

var watchers = [];
watchers.push( $scope.$watch('watch-xxx', function(newVal){
   //do something
}));    

for(var i = 0; i < watchers.length; ++i){
    if(typeof watchers[i] === 'function'){
        watchers[i]();
    }
}

watchers = [];

Answer 6

理想情况下，当您离开示波器时，应移除每个自定义手表。

它有助于更​​好的内存管理和更好的应用程序性能。

// call to $watch will return a de-register function
var listener = $scope.$watch(someVariableToWatch, function(....));

$scope.$on('$destroy', function() {
    listener(); // call the de-register function on scope destroy
});

Answer 7

要丢弃观察者的副本，您可以使用：

watchers = void 0;