ng-idle/core onIdleEnd 和 Mat-Dialog 有问题

Question

我在 Ng-Idle、Material 6 和 Angular 6 中发现了一个问题

"@ng-idle/core": "^6.0.0-beta.3"
"@ng-idle/keepalive": "^6.0.0-beta.3"
"@angular/core": "^6.1.9"
"@angular/cdk": "^6.4.7"
"@angular/material": "^6.4.7"

场景

当用户空闲时，对话框（弹出窗口）会显示用户退出系统之前的倒计时。如果用户在用鼠标活动注销之前返回，倒计时将停止并且对话框将关闭/消失。

问题

但是，在 Angular 5 中，此功能一直运行良好，直到我升级到 Angular 6。当用户在 之前返回时onTimeout，它会触发 ，onIdleEnd但对话框不会在鼠标活动时消失。我创建了一个 Angular 6 应用程序来复制这个问题。我试图确定这是 Ng-Idle 还是 Angular 问题。

使用 Ng-Idle 进行 Stackblitz

Stackblitz 显示 Mat-Dialog 在 10 秒倒计时后关闭

GitHub

有没有人遇到过这个问题？

Answer 1

我遇到过同样的问题。我通过推动角度的变化来解决它。

第一的：

{ AppplicationRef } from '@angular/core';

在组件的构造函数中添加 ChangeDetectorRef：

constructor(private appRef: ApplicationRef)

然后在 onIdleEnd 上调用它：

this.idle.onIdleEnd.subscribe(() => {
    this.showModal = false;
    this.appRef.tick();
});

StackBlitz 解决方案。