5

Ich frage mich, ob Sie ein Beispiel für eine Richtlinie Code haben, wie $routeChangeError auf Winkel Ereignisse reagiert ohne $rootScope in ihm die Injektion ($on in Link-Funktion zu verwenden). Es bricht meiner Meinung nach MV * -Muster und "erzeugt" Geruch-Code (gibt die Möglichkeit, root Umfang in einer Direktive zu manipulieren). Danke im Voraus.

Antwort

5

Wenn Sie nur auf Ereignisse warten, müssen Sie nicht die $rootScope; z.B. $scope.$on("$routeChangeError") über den Anwendungsbereich der Richtlinie, entweder von Controller oder Link-Funktion.

Sie sehen, die "$routeChangeError" wird von der $rootScope gesendet, so dass alle Kinder es erhalten.

8

Nein. Es gibt keine Möglichkeit, Angular-Events zu hören, ohne Zugriff auf $scope zu haben. Das ist einer der Hauptgründe, warum sie den Dienst $rootScope haben, so dass Sie während eines Dienstes oder eines anderen Moduls auf $scope zugreifen können.

In einer Direktive müssen Sie jedoch $rootScope nicht injizieren, da Sie in der Direktive in der Verknüpfungsfunktion bereits einen isolieren Bereich haben.

Zum Beispiel:

.directive('myDirective', function(){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attrs){ 
      scope.$on('some-event', function(e){ 
       // respond to event here 
      }); 
     } 
    }; 
}); 

Ihre scope Variable ist ein scope "isolieren", so dass es nicht ihre Mutter Umfang in keiner Weise beeinflussen können. Dies hat jedoch einige seltsame Nebeneffekte, wenn Sie versuchen, ein Ereignis an ein Modul der Schwesterebene zu senden, da Winkelereignisse nur aufwärts oder $broadcast nach unten durch die Bereichshierarchie gehen. Wenn nicht, sollte das obige Beispiel perfekt funktionieren. Wenn Sie sind, dann wird das folgende Beispiel ist eine Möglichkeit, es zu tun:

.directive('myDirective', function($rootScope){ 
    var isolateScope = $rootScope.new(); // creates a new isolate copy of $rootScope 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attrs){ 
      isolateScope.$on('some-event', function(e){ 
       // respond to event here 
      }); 
     } 
    }; 
}); 

Dies wird eine ähnliche Isolat Kopie $rootScope zu erstellen, so dass alle Änderungen, um es nicht andere Module oder Dienstleistungen auswirken werden. Dies verhindert Probleme mit "smell-code", wie Sie es genannt haben.

5

$on Methode basiert auf interne Scope.prototype definiert sind, und da jeder Rahmen in Angular von Scope Konstruktor erstellt wird dies bedeutet, jeder Bereich auf eine sich $on Verfahren zur Verfügung hat. Es gibt keine Notwendigkeit $rootScope zu injizieren, rufen Sie einfach die $on Methode Richtlinie Anwendungsbereich Verknüpfung Funktion direkt:

app.directive('myDirective', function(){ 
    return function(scope, element, attrs){ 
    scope.$on('$routeChangeError', function(){ 
     // ... 
    }); 
    } 
}); 
+1

Bedeutet es, dass die Lösung von John Lindquist in seinem Tutorial gezeigt http://egghead.io/lessons/angularjs- directive-for-route-handling ist einfach schlecht designed ** (_Verwenden Sie AngularJS $ rootScope innerhalb einer Direktive, um Fehler bei der Routenänderung zu erkennen und dem Benutzer anzuzeigen_)? Eigentlich war dieses Video der Auslöser meiner Frage. –

Verwandte Themen