Angular6中監聽DOM元素事件

背景：

因爲使用原生addEventListener方法會致使this指向有問題，而且沒法移除事件監聽，致使事件屢次綁定，影響性能，而es6中都是箭頭函數,因此ng6中能夠使用使用rxjs

1、package.json

node版本：8.10.0

 

angular版本：6.0.7

 

rxjs版本：6.2.1

 

2、代碼實現

 1 import { fromEvent } from 'rxjs';
 2 
 3 // 綁定頁面點擊事件
 4 monitorClick() {
 5     this.$pageClick = fromEvent(document, 'click').subscribe(() => {
 6       //
 7     });
 8  }
 9 
10 // 移除頁面點擊事件
11 removeClick() {
12     if (this.$pageClick) {
13       this.$pageClick.unsubscribe();
14     }
15 }