AngularJS: Lösche $ watch

277

Ich habe eine Überwachungsfunktion in meiner AngularJS-Anwendung.

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

Nach einer gewissen Bedingung (in meinem Beispiel durch Ändern der Seite in meiner Einzelseitenanwendung ) möchte ich diese Überwachung jedoch stoppen (z. B. beim Löschen eines Zeitlimits).

Wie kann ich das machen?

javascript angularjs watch

— Kamaci
quelle

520

$watchGibt eine Abmeldungsfunktion zurück. Wenn Sie es nennen, wird das abgemeldet $watcher.

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

— Umur Kontacı
quelle

24

Wissen Sie, ob es eine gute Praxis ist, alle Ihre Listener am Ende eines Controller-Lebenszyklus (wie bei einem $on('$destroy')) abzumelden, oder ob AngularJS sich um sie kümmert? Vielen Dank!

— yorch

81

Alle Beobachter werden entfernt, wenn das

— Zielfernrohr

6

Sie können hier eine interessante Diskussion sehen, die die Angelegenheit erklärt: github.com/angular/angular.js/issues/4574 Wenn Sie dem $ rootScope einen Listener zuweisen, müssen Sie ihn grundsätzlich selbst zuweisen, sonst bleibt er bestehen $ scope ändert sich. Beobachter auf $ scope werden mit dem $ scope zerstört ($ scope sind in Angular keine Singletons und werden bei Bedarf erstellt und zerstört).

— Mladen Danic

3

Aber was ist, wenn ich nur möchte, dass der Beobachter überprüft, ob der Wert vorhanden ist, und dann, wenn er vorhanden ist, einige Änderungen vornimmt und sich dann selbst registriert? Ich habe es bereits versucht - var listen = $ scope. $ Watch ('mvIdentity.currentUser', Funktion (currentUser) ) {test = 1; console.log ("->" + $ scope.updateemail + "-" + test); listen ();});

— Harshit Laddha

4

@ UmurKontacı Eigentlich ist der Kommentar von deadman vollkommen gültig, da Ihr ursprünglicher Kommentar nicht in jedem Fall korrekt ist.

— GFoley83

49

scope. $ watch gibt eine Funktion zurück, die Sie aufrufen können und die die Registrierung der Uhr aufhebt.

Etwas wie:

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

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

— Anders Ekdahl
quelle

14

Ja, Sie können sich innerhalb der watchFn lösen! Einfacher Anwendungsfall: Sie möchten watchFn nur einmal ansehen und ausführen und dann aufhören zu schauen.

— Mike Rapadas

3

Kann ich die Uhr nach dem Aufrufen der Aufhebungsfunktion erneut binden, wie wenn ich sie erneut aufrufe?

— Bruno Finger

Das war nützlich. Das Aufheben der UnbindWatch in einer Zeitüberschreitung scheint für meine Tests wichtig zu sein.

— Eeejay

In diesem Fall sollten Sie $ timeout verwenden, das Sie auch abmelden können!

— Ben Taliadoros

Am besten vermeiden Sie Timeouts

— Davi Lima

25

Sie können die Uhr auch im Rückruf löschen, wenn Sie sie sofort löschen möchten, nachdem etwas passiert ist. Auf diese Weise bleibt Ihre $ watch bis zur Verwendung aktiv.

Wie so ...

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

— SoEzPz
quelle

4

Irgendwann ruft Ihre $ watch auf dynamicallyund erstellt ihre Instanzen, sodass Sie die Deregistrierungsfunktion vor Ihrer $watchFunktion aufrufen müssen

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

— naCheex
quelle

4

Im Idealfall sollte jede benutzerdefinierte Uhr entfernt werden, wenn Sie das Zielfernrohr verlassen.

Es hilft bei der besseren Speicherverwaltung und der App-Leistung.

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

— Manish Kumar
quelle

4

Wenn Sie zu viele Beobachter haben und alle löschen müssen, können Sie sie in ein Array verschieben und alle $watchin einer Schleife zerstören .

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 = [];

— Rewar
quelle

-10

Zum Verwerfen der Kopie von Beobachtern können Sie Folgendes verwenden:

watchers = void 0;

— Shailendra Pathak
quelle