$ emit wird mehr als einmal angularJS aufgerufen

Question

Ok dieser Code ruft meine $ emit Funktion mehr als einmal auf. Ich möchte es nur einmal anrufen.

Ich habe einen Controller und zwei Direktiven. Zusammenfassend möchte ich, dass eine Anweisung eine Nachricht an den Controller sendet und der Controller eine Nachricht an die andere Direktive sendet. Brauche Hilfe.

Aus dem newby angularJS Coder.

enter code here 

app.controller("myCtrl", ['$scope', '$http', '$routeParams', 'myCounter', '$rootScope', function ($scope, $http, $routeParams, myCounter, $rootScope) { 

/////////////////////////////////////////// 
Listener = $scope.$on('eventEmit', function (event, args) { 

    event.stopPropagation(); 
    console.log("hi from controller"); 

    // broadcast down to directives 
    childPosition = 0; 
    $scope.$broadcast('eventBroadcast', childPosition); 

}); 

// destroy listener 
$scope.$on('$destroy', Listener); 

}]); 

„Seite“ Richtlinie Nur 1 „Seite“ kann zu einem Zeitpunkt sichtbar. Eine Seite kann im Inneren einer anderen Seite nicht existieren Welche Seite sichtbar ist, wird

enter code here 
app.directive('myPage', function (myCounter) { 
return { 
    template: '<div ng-show = "showContent" >content {{counter}}</div>', 
    restrict: 'EA', 
    controller: 'myCtrl', 
    scope: { 
     nextPage: '&', 
     showContent:'<' 

    }, 

    link: function (scope, element, attr) { 

     /////////////////////////////////////////// 
     scope.$on('eventBroadcast', function (event, args) { 

      console.log("hi from directive"); 

     }); 
    } 

}; 


}) 

„Ereignis“ Richtlinie durch Befehle an die Steuerung bestimmt werden auf die Ereignisse seiner Mutterelement hören und Befehle senden über, wenn die Ereignis, auf das es wartet, passiert. 2 Attribute Typ - Auf welches Ereignis sollte geachtet werden (wie "Klick") Aktion - Was soll passieren, wenn das Ereignis eintritt? die Veranstaltung Richtlinie soll zum Beispiel eine Nachricht senden, um die Steuerung zu sagen, die Nächste Funktion aufzurufen

enter code here 
app.directive('myEvent',['$rootScope', function (myCounter,$rootScope) { 
return { 
    restrict: 'EA', 
    controller: 'myCtrl', 

    template: '<input type = "button" ng-click = "handlePrev()" ng- 
    transclude>Prev</input>' + 
     '<input type = "button" ng-click = "handleNext()" ng- 
    transclude>Next</input>', 
    transclude:true, 
    link: function ($scope, element, attrs) { 


     $scope.handleNext = function() { 

      $scope.functionValue = "nextPage"; 
      pageController($scope.functionValue, $scope); 
      console.log("Clicked next", $scope.functionValue); 


     } 
     $scope.handlePrev = function() { 

      $scope.functionValue = "prevPage"; 

      pageController($scope.functionValue, $scope); 

     } 

    } 



}; 
}]) 


pageController = function (string, $scope) { 


myEmitter = $scope.$emit('eventEmit', string); 
$scope.$emit('$destroy', myEmitter); 
} 

Answer 1

Es gibt drei Lösungen für dieses Problem:

1. dass emit Stellen Sie sicher, nur einmal aufgerufen wird (Mai nicht möglich sein).

2. Sehen Sie sich die 2 Ereignisse an, die ausgelöst werden. Sind sie das gleiche Ereignis? Zum Beispiel sind beide Click Events oder ist ein Click Event und ein anderes Event. Wenn Sie daran interessiert sind nur in dem Click-Ereignis sind dann etwas tun, wie ..

   if (event.target.type === 'click') { 
       // run your code here 
   } 
   

3. Wenn alles andere fehlschlägt, können Sie Entprellen oder das Ereignis drosseln, die es bedeutet, kann nicht zweimal in einem bestimmten Zeitrahmen genannt werden. Zum Beispiel wird sichergestellt, dass es innerhalb von 300 ms nicht zweimal aufgerufen werden kann. Der zweite Anruf wird ignoriert. Wenn Sie diesen Ansatz verwenden möchten, verwenden Sie Lodash debounce oder Lodash throttle.