从代码的几个diffentes部分发送$ emit / $ broadcast,并将它们放在一个地方

时间:2015-08-04 17:55:12

标签: javascript angularjs

我从代码的不同部分和不同的控制器发送$ emits *(或$ broadcast),并且只从一个地方拦截这些广播或发出。 它似乎工作正常,但我想知道它是不是一种不好的做法(发送几个$ emit被同一个$截获)或者它是否会影响性能或者它可能只是具有负面影响的东西我失踪了。

下面是一个示例,说明我如何从不同的地方发送$ emits并从同一个$上截取。

*在此示例中,控制器1是控制器2的子节点,这就是我使用$ emit而不是$ broadcast的原因。

Cotroller1:

  $scope.updateSelectionLine = function(slip, offset) {
    BetSlipFactory.updateSelectionLine(slip, offset).then(function() {
      $scope.$emit('lines:accordionChanged');
    }, function(err) {
      console.log(err);
    });
   };

    $scope.updateSelectionLine = function(availableBetTypes) {
      if (availableBetTypes.length) {
        $scope.$emit('lines:accordionChanged');
      }
    }

控制器2:

$scope.$on('lines:accordionChanged', function() {
  $scope.refreshLines();
});

2 个答案:

答案 0 :(得分:2)

发出事件本身并不是一种坏习惯;相反,它是不同“不相关”组件之间通信的推荐模式。既然如此,通常会看到该功能被滥用或过度使用。在确定是否使用发布/订阅事件时,我通常会至少检查以下列表:

  • 是否有另一种方式以简单的方式做同样的事情?
  • 我会在哪里发布我的活动?我倾向于坚持只从服务/提供商发布并从控制器订阅。

我使用此模式的案例:

  • 当我尝试实现跨模块通信而不将它们相互耦合时。例如,我可能有一个auth模块,它发出Auth :: LoggedIn和Auth :: LoggedOut事件,以便应用程序中的其他模块可以订阅它们并做出相应的反应。

  • 当我试图保持多个控制器的数据同步时。在这种情况下,我创建了一个“拥有”数据的服务和使用/更改它的多个控制器。当数据发生变化时,服务会发出一个事件,消费控制器会监听它并在必要时进行更新。

答案 1 :(得分:1)

我认为你正在做的很好,使用$ emit或$ broadcast没有大量的性能问题,除了我会避免使用$ rootScope。$ emit()或$ broadcast()。这些都是高度优化的调用,不建议为它们污染根范围。

另一种思路是,如果$ scope.refreshLines()可以作为一个服务打包,你可以注入每个相应的控制器。如果这是一个指令,你将在一个页面上使用大量的我建议使用服务,因为$ scope.refreshLines()将触发指令的每个实例。如果你不打算在页面上使用这个次数超过2-3次,那么性能影响很小。