Angularjs (1.6) 使用 $broadcast,$on? 共享一个函数？答案

【问题标题】：Angularjs (1.6) sharing a function using $broadcast,$on?Angularjs (1.6) 使用 $broadcast,$on? 共享一个函数？
【发布时间】：2017-12-01 19:13:27
【问题描述】：

是否可以使用 $broadcast 和 $on/$emit 将其控制器内部存在的组件中的功能共享给不同组件下的完全不同的控制器（见上图）？我从谷歌尝试了不同的例子，不知道我做错了什么。这是功能（在图片中的管理组件内）：

 refreshMarkers = (newMarkerSet) => {
        this.leafletData.getMap(this.mapId).then((map) =>  {
            if(this.previousLayer != null){
                this.$log.debug('removing map layer %o and adding %o', this.previousLayer, newMarkerSet);
                map.removeLayer(this.previousLayer);
                map.addLayer(newMarkerSet);
                this.previousLayer = newMarkerSet;
            }
        });
    };

在一个完全不同的组件（图中的 map-setting.controller.js）内的不同控制器中，我想像这样使用该功能：

  deleteAllZones = () => {
    let message = this.$filter('translate')('SI-MESSAGES.DELZONE-MSG');
    let title = this.$filter('translate')('SUBHEADER.DELZONE-TITLE');
    let button = this.$filter('translate')('BUTTON.DELETE');
    this.siAlertDialog.confirm(message, title, button).then(() => {
        this.deleteAllMapZones();
        this.refreshMarkers(); /////like this 
    })
};

一切都是用 es6 编写的，控制器包装在类中并使用构造函数。万一这很重要

administration controller i am saying

 this.$rootScope.$on('refreshmap'),()=>{
      this.refreshmap()
  }

在 map-setting.controller.js 中

 notifyMap = () =>{
    this.$rootScope.$broadcast('refreshmap')
  }

功能原来在管理中（ps.看图）

【问题讨论】：

您发布的代码中没有 $broadcast 或 $emit。见stackoverflow.com/help/mcve。无论如何，这看起来是个糟糕的主意。范围事件用于...事件。不适用于单位之间的共享行为。 将存在于其控制器内部的组件中的功能共享给不同组件下的完全不同的控制器 - 这可能应该通过服务来完成。
我试图从社区获得一个干净的代码，为此看到了很多不同的设置。只是想看看这是否可能以及如何
可以将任何东西作为作用域事件负载传递，包括函数。不应该这样做，因为范围事件设计方面没有那么多好的用例，而这个显然不是其中之一。无法说出如何，因为不清楚您的代码有什么问题。请提供 MCVE。
同意上面的 cmets，您应该为此使用服务，并相应地管理状态。控制器功能应该被隔离到控制器的范围内。如果你需要通知一个控制器另一个控制器发生了变化，可以考虑观察者/监听者模式，redux，或者使用 $broadcast 和 $on 来通知控制器调用服务函数。
我可以使用 rotoscope 来实现吗？我可能永远不会在其他任何地方使用该功能。只是想知道除了服务之外的任何其他选择

标签： javascript angularjs eventemitter angular-components

【解决方案1】：

使用service分享函数。

  app.Service('myService', function(){

      this.myFunc() {

            return 1;
      }

  })

在控制器中注入服务

  app.Controller('myCtrl', [ 'myService', function(myService) {

    myService.myFunc();

  }])

【讨论】：

这个问题适用于 AngularJS。不是 Angular 2+。
这是一个角度 1.x 的问题
根据 Angular 1.x 编辑

【解决方案2】：

服务绝对是我问题的最佳答案。但如果有人想知道如何通过广播来完成，请在 .在这里（Angular 团队不推荐）

所以我执行操作的控制器

   notifyMap = () =>{
    this.$rootScope.$broadcast('refreshmap')
}

then this.notifyMap () //where ever i want to execute

聆听//

 this.$scope.$on('refreshmap',()=>{
      console.log('recieved...............');
      this.refreshMarkers();
  })

谢谢:)

【讨论】：