Subject 是 Rxjs 里的一个工具对象。
![](https://img.haomeiwen.com/i2085791/90e372c6097183fe.png)
Subject 是一种特殊类型的 Observable,它允许将值多播到许多观察者。 Subject 就像 EventEmitters。
每个 Subject 都是 Observable 和 Observer。 您可以订阅一个主题,您可以调用 next 提要值以及错误和完成。
这个属性定义在 Popover Component 上:
![](https://img.haomeiwen.com/i2085791/b15852fab7504ab6.png)
其赋值操作发生在 Popover Directive 的代码里:
![](https://img.haomeiwen.com/i2085791/eb280891d10e36ec.png)
当 Popover Component 的 Close 按钮被鼠标或者键盘触发时,触发注册好的 close 事件处理函数:
![](https://img.haomeiwen.com/i2085791/ef1635202ac14fee.png)
![](https://img.haomeiwen.com/i2085791/5d377c3ba40bcace.png)
在 close 事件处理函数里,通过 Subject 向其监听者广播 CLOSE_BUTTON_CLICK 或者 CLOSE_BUTTON_KEYDOWN 事件。
![](https://img.haomeiwen.com/i2085791/052ce8720333d1fa.png)
在 Popover Directive 里定义了所有能够触发 Popover Component 关掉的事件,如上图所示。
Popover Directive 是这些事件的监听者。
![](https://img.haomeiwen.com/i2085791/5a95606bf0bc43fc.png)
这里有两个问题:
- handlePopverEvents 什么时候被谁调用?
- 为什么是 Directive 的 close 函数负责关闭 Popover Component?
对于第一个问题,这里能看出端倪了:Popover Directive 的 eventSubject 负责监听事件,然后这个 eventSubject 实例赋给 Component 实例,后者负责发送事件:
![](https://img.haomeiwen.com/i2085791/f8e3fb3d936810e5.png)
close 操作:
![](https://img.haomeiwen.com/i2085791/35ae6e46a2704d5e.png)
如果注释掉上图第155行,则无法关闭 Popover Component 了:
![](https://img.haomeiwen.com/i2085791/6f3d7dba6a56fe52.png)
更多Jerry的原创文章,尽在:"汪子熙":
![](https://img.haomeiwen.com/i2085791/97c4752c0e619c44.png)
网友评论