AngularJS: Ясний $ годинник

У моїй програмі AngularJS у мене є годинник.

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

Однак після певної умови (в моєму прикладі, зміни сторінки в моїй односторінковій програмі ) я хочу зупинити цей перегляд (як, наприклад, очищення тайм-ауту).

Як я можу це зробити?

$watchповертає функцію зняття реєстрації. Якщо зателефонувати, це скасує реєстрацію $watcher.

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

$ watch повертає функцію, яку ви можете зателефонувати, і яка скасує реєстрацію годинника.

Щось на зразок:

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

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

Ви також можете очистити годинник всередині зворотного дзвінка, якщо ви хочете очистити його відразу після того, як щось відбувається. Таким чином ваш годинник $ буде залишатися активним до використання.

Як так ...

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!
  } 
}

Деякий час ваш годинник $ дзвонить, dynamicallyі він створить його екземпляри, тому вам доведеться викликати функцію зняття реєстрації перед вашою $watchфункцією

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

В ідеалі кожен користувальницький годинник слід зняти, коли ви виходите з області застосування.

Це допомагає в кращому управлінні пам’яттю та кращій роботі програми.

// 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
});

Якщо у вас занадто багато спостерігачів і вам потрібно очистити їх, ви можете натиснути їх на масив і знищити кожного $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 = [];

Для відмови від копії спостерігачів ви можете скористатися цим:

watchers = void 0;