Javascript 角度自定义空闲计时器

嘿，伙计们，现在我试着实现我自己的空闲计时器。我想到了一种服务，可以初始化全局事件。这些将重置计时器。但在我当前的实现中，似乎存在上下文问题，因为我无法使用“this”访问函数

服务：

import { Injectable } from '@angular/core';

@Injectable()
export class IdleService {

  constructor() {
           document.addEventListener("click", this.resetTimer, false);
   }

    public timeoutID:number;

     startTimer() {
        console.log("timer started");
        this.timeoutID =  setTimeout(() => {this.goInactive()}, 5000);
        console.log(this.timeoutID) 
    }

     resetTimer() {
        console.log(this.timeoutID);
        console.log("reset");
        clearTimeout(this.timeoutID);
    }

     goOffline() {
            //alert("Hey");
            console.warn("goInactive");
            // this.logout();
    }


    }

应用程序组件：

import { Component } from '@angular/core';
import { IdleService } from './idle.service';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  constructor(private idleService: IdleService){
       this.idleService.startTimer();
  }
  name = 'Angular 5';
}

如果你对如何解决这个问题有更好的想法，请随时告诉我。我知道Angular并不是专门为全球赛事设计的，但我需要这个功能

这里还有一个Stackblitz，如果你想玩一玩的话。

---

如果还有人感兴趣。我将eventlistener移动到一个可观察的对象，然后上下文就正确了。但我只是建议你看一看

---

如果我有最终答案，我也会在这里发布。

你现在有最终答案了吗？最后我使用了ng2 idle。。但是我想我会用stackblitz做更多的事情，因为这个库不适合任何用例