天天看点

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

比SAP的UI5 event bus要复杂些

调用栈1:应用代码里,抛出sendData的事件,参数为下图调试器里的json对象:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈2:还是在应用层代码内:

this._eventBus = new Subject();

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

broadcast方法的实现是将执行转交给this._eventBus.

调用栈3:典型的观察者-发布者模式,遍历当前所有观察者,调用next方法

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈4: 执行订阅者原型链上的next方法:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈5:执行FilterSubscriber原型链上的next方法:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈6:执行MapSubscriber原型链上的next方法:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

调用栈7:执行SafeSubscriber原型链上的next方法:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

最终执行到应用层里的观察者的对应方法:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理

通过这张图来理解:

Angular应用里使用rxjs提供的观察者和发布者实现事件处理