共计 776 个字符，预计需要花费 2 分钟才能阅读完成。
Popover Component 的 appendToBody 如果设置成 true：
则其 DOM 元素会呈现在 body 节点的 开端 :
当我点击屏幕任意空白地位时，这个 Popover 对话框会主动隐没。
精确的说，是从 DOM tree 中移除，而不是设置成 invisible.
Popover 自定义指令的实现源代码里，会通过 @HostListener 来监控宿主元素的 document:click 事件。
如果 this.insideClicked 为 false，阐明是 outside_click, 因而应用 eventSubject 发送这个事件。
这里要解决两个问题：
- this.insideClicked 的标记位什么时候设置的？
- 通过 EventSubject 发送的诸如 OUTSIDE_CLICK 的事件，监听者是谁？
首先解决第一个问题。如果 Popover 自身的宿主元素，即 Popover Component wrapper 被点击，this.insideClicked 被置为 true，同时发送 PopoverEvent.INSIDE_CLICK 事件：
否则，当 document:click 事件触发时，阐明 Popover Component wrapper 之外的区域被点击，此时发送 PopoverEvent.OUTSIDE_CLICK 事件：
第二个问题：
在 handlePopoverEvents 办法的 this.popoverContainer.instance.eventSubject.subscribe 里，注册 EventSubject 对应事件的处理函数：
函数 handlePopoverEvents 在 Popover 实例创立后，执行其办法 renderPopover 时被调用：
留神，this.viewContainer.clear 办法调用，触发 DOM 元素被删除的原生操作。
更多 Jerry 的原创文章，尽在：” 汪子熙 ”:
