Angular 事件持续时间

一个非常简单的解决方案是使用会话存储。获取按钮单击事件执行的时间、调用 api 之前的时间、调用 api 的第一个“地图”或“订阅”中的时间，然后使用函数 ngAfterViewInit() 知道它已重新渲染。

首先是按钮点击...

buttonClicked() {
   const nowMilliseconds = Date.now();
   window.sessionStorage.setItem('button', nowMilliseconds);
   this.myService.callApi()
      .subscribe(response => {
           const responseMilliseconds = Date.now();
           window.sessionStorage.setItem('response', responseMilliseconds);
           // make sure to set some value here that will make the screen have to re-render
       });
}

ngAfterViewInit() {
   const renderedNow = Date.now();
   window.sessionStorage.setItem('rendered', renderedNow);
}

并在您的服务...

callApi() {
   const callingApi = Date.now();
   window.sessionStorage.setItem('apicall', callingApi);

   return this.httpService.get('myApiEndpoint');
}

然后在一切完成后获取值，您可以查看您的开发人员工具并查看毫秒并计算差异，或者您可以使用 window.sessionStorage.getItem('apicall'); 在角度代码中获取它们；... 用其他字符串替换 apicall 以获取其他值。