Question

我一直在玩Angular，并且一直试图找到一种在整个组件树中使用pub / sub机制的方法。

似乎EventEmitter只发出一个可以订阅一级的事件 - 但不是更多。同样，它只发出树上的事件但现在已经失效。

相关代码在这里：

class App {
  onAncestor($event) {
     console.log('in ancestor, decendent  clicked',$event);
  } 
}

 ...
class Entities {
   ....
   onParent($event) {
     console.log('in entities parent, child  clicked',$event);
   } 

   onGrandParent($event) {
      console.log('in grand parent, grandschild  clicked',$event);
   }

}

只调用onParent，而不是onGrandparent或onAncestor。同样，它也不会向下发布。

Answer 1

使用Angular 2会出现一个名为RxJs的observables库，因此可用于创建我们可以订阅和提交事件的服务。

然后我们使用依赖注入机制将该服务注入到我们需要它的应用程序的任何位置。

因此广播/发射事件机制不再需要了，因为它被更强大的observables机制取代，该机制在框架中的任何地方内置：EventEmitter是一个可观察的，表单值是可观察的，http可以返回可观察量等。

有关如何使用RxJs为发布/订阅构建服务的示例，请参阅此repository。

Answer 2

在AngularJS 1.x世界中，您可以使用ng-contexts，这是我们在我的组织中编写的轻量级插件，用于使用< em> pub / sub 模型。

Intuitive state management for AngularJS applications

如果您从AngularJS继续学习，显然可以选择AngularUniversity的答案。

Answer 3

https://www.npmjs.com/package/@fsms/angular-pubsub

this.pubsubService.subscribe({ ?// Subscribing to a message
        messageType: PlaceOrder.messageType,
        callback: (msg) => console.log('received', msg),
      })

this.pubsubService.publish( ?// Publishing a message
      new OrderCreated({
        orderId: new Date().getTime().toString(36),
        item: '20 Apples',
      })
    );

Answer 4

看看这个库 ng-event-bus (https://www.npmjs.com/package/ng-event-bus)

它是基于 RxJS 的消息/事件总线服务，适用于受 NgRadio 启发的 Angular 应用程序。

您可以发布 msg，并在代码的其他部分订阅它。

如何在Angular中创建发布者/订阅者模型？

4 个答案: