本文介绍了角模块在全球传播:事件总线或调解模式/服务的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

到目前为止,我已经看到了这个问题的许多解决方案。最简单的一个,当然,到 $发出 $ rootScope 事件作为一个事件总线例如(https://github.com/btilford/anti-patterns/blob/master/angular/Angular.md )

So far I have seen many solutions of the problem. The simplest one is, of course, to $emit an event in $rootScope as an event bus e.g. ( https://github.com/btilford/anti-patterns/blob/master/angular/Angular.md )

angular.module('myModule').directive('directiveA', function($rootScope) {
  return {
    link : function($scope, $element) {
      $element.on('click', function(event) {
        $rootScope.$emit('directiveA:clicked', event);
      });
    }
  }
});
angular.module('myModule').directive('directiveB', function() {
  return {
    link : function($scope, $element) {
      $rootScope.on('directiveA:clicked', function(event) {
        console.log('received click event from directiveA');
      });
    }
  }
});

和另外一个是调解或发布订阅功能/一个封闭的范围申报服务例如(Communicating多重控制器和指令之间)。

and another one is to declare a service with a mediator or pubsub functionality / an enclosed scope e.g. ( Communicating between a Multiple Controllers and a directive. )

module.factory('MessageService',
  function() {
    var MessageService = {};

    var listeners = {};
    var count = 0;
    MessageService.registerListener = function(listener) {
      listeners[count] = listener;
      count++;

      return (function(currentCount) {
        return function() {
          delete listeners[currentCount];
        }
      })(count);
    }

    MessageService.broadcastMessage = function(message) {
      var keys = Object.keys(listeners);

      for (var i = 0; i < keys.length; i++) {
        listeners[keys[i]](message);
      }
    }

    return MessageService;
  }
);

问题是:


  • 有没有点使用的角度应用第二个?

  • ,什么是优点和每一个这些的利弊比较彼此?

推荐答案

编写AngularJS应用程序时创建自己的实现事件发射器是适得其反。角已经提供了所需的基于事件的通信的所有工具。

Creating your own implementation of event emitter is counter-productive when writing an AngularJS application. Angular already provides all tools needed for event-based communication.


  • 使用 $发出 $ rootScope 工作得很好全球服务间通信,不会真的有什么缺点。

  • 视图组件(指令,控制器)之间的
  • 使用 $广播上一个自然的范围(一个是绑定到DOM的一部分)提供范围的通信。

  • $ rootScope 使用 $广播带来两个previous分在一起(它提供了一个完全的全球通信平台)。的这是任何基于AngularJS库基本上都采用了那里的解决方案。

  • Using $emit on $rootScope works nicely for global inter-service communication and doesn't really have any drawbacks.
  • Using $broadcast on a natural scope (one that is bound to a part of your DOM) provides scoped communication between view components (directives, controllers).
  • Using $broadcast on $rootScope brings the two previous points together (it provides a completely global communication platform). This is the solution used basically by any AngularJS-based library out there.


  • 如果你担心在previous选项的性能和你真的想你单独的事件发射器,你可以很容易地通过创建一个孤立的范围(创建一个 $ rootScope。$新的(真正的)),并使用 $广播就可以了。 (然后你可以把它包装成一个服务,你希望的任何地方注入它。)

  • If you're worried about performance in the previous option and you really want your separate event emitter, you can easily create one by creating an isolated scope ($rootScope.$new(true)) and using $broadcast on it. (You can then wrap it into a service and inject it anywhere you want.)

最后一个选项创建发射器集成到角(在你的问题中提供的实施将至少需要包装在 $所有侦听器调用应用全面的事件()正确地整合),可被额外用于数据变化的观察中,如果适合特定的用例。

The last option creates a full-fledged event emitter integrated into Angular (the implementation provided in your question would at least need to wrap all listener calls in $apply() to integrate properly) that can be additionally used for data change observation, if that fits a particular use-case.

但是,除非你的应用程序真的是堆积如山,或者你真的偏执事件名称冲突,前三个选项应该足够了就好了。

However, unless your application is really humongous, or you're really paranoid about event name collisions, the first three options should suffice just fine.

我不会进入你的组件之间的通信的其他方式的细节。一般来说,当情况使用范围,控制器的直接互动,或通过通信DOM节点属性,你应该知道它的数据共享要求。

这篇关于角模块在全球传播:事件总线或调解模式/服务的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 03:42