2016-07-01 5 views
4

Jetzt werde ich $scope Abhängigkeit von meinem Winkel Controller loswerden, um sicherzustellen, dass ich leicht meinen Code zu Angular2 migrieren könnte. Meine aktuelle Winkelversion ist . Während der gleichen Sache gibt es Platz, während ich $destroy Listener über meine Controller-Bereich wie $scope.$on('$destory', function() ....) platziert.

Ich kann sehen $on Methode nur auf $scope Controller, aber wie kann ich es ohne $scope Abhängigkeit zu erreichen.

Antwort

4

Wenn Sie angular 1.5+ verwenden, haben sie lifecycle hooks hinzugefügt, die Sie auf Ihrem Controller aktivieren können. No $scope benötigt. Fügen Sie einfach eine Funktion $onDestroy() zu Ihrem Controller aufgerufen und es wird aufgerufen, wenn der Controller aufzuräumen sein wird:

$onDestroy() - Called auf einem Controller, wenn die darin enthaltenen Umfang ist zerstört. Verwenden Sie diesen Hook, um externe Ressourcen, Uhren und Event-Handler freizugeben.

Beispiel von http://blog.thoughtram.io/angularjs/2016/03/29/exploring-angular-1.5-lifecycle-hooks.html:

function MyCmpController($element) { 

    var clickHandler = function() { 
    // do something 
    }; 

    this.$onInit = function() { 
    $element.on('click', clickHandler); 
    }; 

    this.$onDestroy = function() { 
    $element.off('click', clickHandler); 
    }; 
} 
+0

Vielen Dank für diese zu teilen. Meine Antwort löst nur das Problem bis zur Version 1.4.X, aber Ihre Lösung sieht vielversprechend aus, da sie für 1.5+ funktioniert, im Grunde hatte ich mein Projekt auf der Version 1.4.X und hatte Mühe, es von einigen Stunden an zu arbeiten $ element. $ on ('$ destroy', ...) 'funktioniert .. Also habe ich es hinzugefügt, Danke :-) –

3

Nach einigen Recherchen fand ich, dass das $destroy Ereignis emittiert wird, während DOM Entfernen & auf denselben DOM Umfang es $destroy Ereignis überträgt, aber zugleich gleicht dieses Ereignis auf DOM propagiert wurde, die entfernt werden soll.

Sie wissen, dass es eine Abhängigkeit gibt $element, wenn Sie injizieren, dass in Controller geben Sie das DOM, wo Sie ng-controller Direktive Platz haben. So injizieren $element in Ihrem Controller & dann legen Zuhörer darüber, wie unten

$element.on('$destroy', function(){ 
    //write clean up code here 
}); 

Minen Lösung bis 1.4.X Version arbeiten. Für Version 1.5.3+ können Sie Winkel lifecycle hook verwenden, das $onDestroy ist, wie von @pgreen2 in obiger Antwort gezeigt. Danke :)