javascript - 如何在 angularjs 的 for 循环中动态创建 $rootScope.$on 事件监听器

Question

我想在 angularjs 服务中动态创建事件监听器，但是似乎我在服务的 for 循环中创建的每个 $rootScope.$on 事件监听器被以下事件监听器覆盖。如何动态创建 $rootScope.$on 甚至监听器而不覆盖以前的事件监听器？我使用 Controller 中的广播创建事件，例如 $rootScope.$broadcast(EVENTS.userDeleteSuccess.event);。

我的 EVENTS 常量如下所示:

myApp.constant('EVENTS', {
    userDeleteSuccess: {
        event: 'user-delete-success',
        type: 'success',
        message: 'User successfully deleted'
    },
    ...,
    siteDeleteSuccess: {
        event: 'site-delete-success',
        type: 'success',
        message: 'Site successfully deleted'
    }
}

我的服务如下:

myApp.service("Alert", function($rootScope, EVENTS) {

    var show = function(type, message) {

        $rootScope.alert = {
            type: type,
            message: message,
            show: true
        };
    };

    // Initialized on application startup, this is the problem method!

    this.initialize = function() {
        for(var event in EVENTS) {
          if(!EVENTS.hasOwnProperty(event)) break;
          var _event = EVENTS[event];
          $rootScope.$on(_event.event, function() {
            show(_event.type, _event.message);
          });
        }
      };

      return this;
});

唯一广播的事件始终是对象中的最后一个事件(在本例中为 siteDeleteSuccess)。如何在 for 循环中动态创建事件监听器，且不会覆盖之前的 $rootScope.$on 事件监听器？

Answer 1

使用 IIFE 可以做两件事或者只是绑定(bind)参数，以便将它们传递到函数中

IIFE

(function(event){
    $rootScope.$on(event.event, function() {
        show(event.type, event.message);
    });
})(_event);

绑定(bind):

$rootScope.$on(_event, function(event) {
    show(event.type, event.message);
}.bind(null,_event));

bind docs