Angular $ scope. $ Broadcast Nur einmal ausgeführtes Ereignis

Ich habe zwei Codeabschnitte in zwei separaten Controllern (in zwei separaten JS-Dateien); Einer löst ein Angular $scope.$broadcast-Ereignis und der andere einen $scope.$on-Listener aus.

Erste Controller (Datei) Schnipsel:

var Controller1 = function($scope) { 
    $scope.triggerMyEvent = function(){ 
     $scope.$broadcast('triggeredEvent'); 
    } 
    $scope.go = function (path) { 
     $location.path(path); 
    }; 
}

zweiten Controller (Datei) Snippet:

var Controller2 = function($scope) { 
    $scope.$on('triggeredEvent',function(event){ 
     console.log('found triggered event'); 
    }); 
}

Die Anwendung zusammen verdrahtet ist wie folgt:

var app = angular.module("myApp", ["ngRoute"]); 
app.config(function($routeProvider) { 
    $routeProvider 
    .when("/page2", { 
     controller : Controller2 
     template : "/page2.html" 
    }) 
    .otherwise({ 
     template : "<p>Error</p>" 
    }); 
});

Der erste Controller wird durch eine ng-controller Direktive in der Datei index.html referenziert; und die andere Datei, page2.html oben aufgeführt wird verwiesen und von Aktionen auf dem Index geladen:

index.html:

<body ng-controller="Controller1"> 
    <button ng-click="go('/page2.html')">Page 2</button> 
</body>

Das erste Mal, dass ich diesen Code lade das $scope.$broadcast Ereignis ausgelöst wird und die $scope.$on Zuhörer fängt es einfach gut; wenn ich es neu laden, obwohl der $scope.$on Listener es nicht abfängt. Um es klar zu sagen, bei einer anfänglichen Ladung wird das Ereignis ausgelöst und gerade gut erfasst; also wenn ich meinen Server neu starte und auf die Seite zugreife. Wenn ich jedoch die Seite aktualisiere (F5), glaube ich, dass das Ereignis ausgelöst, aber nicht abgefangen wird. Ich bin neu damit zu arbeiten, also vermute ich einen Mangel an Wissen, aber ich habe über $ scope/$ rootScope und Dinge wie $ broadcast/$ emit/$ gelesen. Jede Hilfe wird geschätzt. Ich sehe eine Reihe von Artikeln zu verwandten Themen; nichts unmittelbar Relevantes sehen;

Ich glaube Umfang

Angular $broadcast only updating after page refresh

AngularJS event-based communication through isolate scope

Die vielversprechendsten Verweise auf Isolieren verwendet, aber ich habe nicht in der Lage, etwas zu bekommen, noch zu arbeiten: obwohl ich diesen Artikel tat beachten.

Quelle

2017-02-14 Gedalya

Wir müssen den Rest des Codes sehen. Dies ist einfach nicht genug Informationen, um Ihre Frage zu beantworten. Wie wird 'triggerMyEvent' aufgerufen? Gibt es relevante Vorlagen?Lassen Sie uns die Controller-Definitionen sehen –

Hallo, danke, ich werde versuchen, mehr relevanten Code hinzuzufügen; Aber ich rufe einfach die Funktion an und benutze die Konsolenprotokollierung (nicht oben gezeigt), um zu sehen, dass sie jedes Mal ausgelöst wird. – Gedalya

Ich habe den Code aktualisiert, um ein vollständigeres Bild zu erhalten. – Gedalya

$broadcast und $on arbeiten durch die Scope-Hierarchie. $broadcast sendet eine Nachricht in der Bereichshierarchie an ihre Nachkommen. Alle $on Listener müssen ein Nachkomme des Bereichs sein, von dem die Nachricht gesendet wurde. Wenn Sie von der $rootScope senden, wird jeder Bereich ein Nachkomme sein und jeder Bereich wird in der Lage sein, die Nachricht zu hören. Also, ein Weg, um sicherzustellen, dass Ihre Botschaft durch alle Bereiche erreichbar ist, ist es auszustrahlen wie so:

// just to demostrate. don't put this in a controller 
$scope.triggerMyEvent = function(){ 
    $rootScope.$broadcast('triggeredEvent'); //don't do this in a controller 
}

Idealerweise verfügen Sie nicht Wurf Stammbereich mit Nachrichten mögen. (Eigentlich sollten Sie das wirklich nie tun. Es ist noch schlimmer, wenn Sie $rootScope.$on in einem Controller verwenden, da es jedes Mal einen neuen Listener hinzufügt und beibehält, wenn der Controller initialisiert wird). Um zu der Wurzel Ihres Problems zu gelangen (Wortspiel beabsichtigt), müssen Sie auf diese Hierarchie achten, da dies Ihre Zuhörer beeinflussen wird.

Ein Beispiel für diese Hierarchie:

<div ng-controller="ParentCtrl"> 
    <div ng-controller="ChildCtrl"> 
    </div> 
</div> 

<div ng-controller="SiblingCtrl"> 
</div> 

function ParentCtrl($scope) { 
    $scope.$broadcast('parentMsg'); 
} 

function ChildCtrl($scope) { 
    $scope.$on('parentMsg', function() { 
    // will receive message 
    }); 
} 

function SiblingCtrl($scope) { 
    $scope.$on('parentMsg', function() { 
    // will not receive message 
    }); 
}

Quelle

2017-02-14 22:28:23

Dies kann $ scope. $ Mehr als einmal als neues $ rootScope auslösen $ broadcast wird bei jedem Aufruf dieser Funktion erzeugt. Idealerweise sollte der Controller, der den $ scope. $ Broadcast hat, eine Elternklasse sein, sollte dies lösen. – Chait

In einem Dienst gibt es beispielsweise keinen lokalen Bereich. Wenn Sie eine Nachricht senden möchten, müssen Sie $ rootScope verwenden. Aber es sollte nicht wirklich in einem Controller verwendet werden –

Yup ich stimme voll und ganz zu. Wie Sie vorgeschlagen haben, benötigen wir weitere Informationen, z. B. wo die Funktion aufgerufen wird, die von – Chait

Angular $ scope. $ Broadcast Nur einmal ausgeführtes Ereignis

Antwort

Verwandte Themen