是否可以清除 NGZone 中设置的所有间隔？

Question

我有一个 Angular2 组件，它有一个自定义的第 3 方 JQuery 插件（我们必须使用并且不能更改）在 OnInit event.However 中初始化第 3 方库自由使用 setIntervals。如果我离开视图，间隔仍然有效，而在其他视图上，它们会继续触发小部件行为。

第 3 方组件无法销毁它或清除间隔（这不是很好）。我曾希望在 Angular2 OnDestroy 方法中调用 destroy() 或类似方法。

我想我应该可以使用 Zone 来清理。我做了以下事情：

constructor(elementRef: ElementRef, public zone: NgZone) {
    }

ngOnInit() {
    this.zone.runOutsideAngular(() => {
        $(this.elementRef).3rdPartyWidgetStart();
    });}

ngOnDestroy() {
    var componentzone=this.zone;
    //So do something here to clear intervals set within Zone???
}

我以为它会在我离开时清除间隔。然而，情况似乎并非如此。我还尝试了 run 而不是 runOutsideAngular，但似乎没有帮助。然后我认为 Zone 应该知道所有已设置的间隔，我可以通过它清除它们。它似乎确实认识他们，但似乎无法访问列表并清除它们？使用 Angular 2 RC 的任何想法 - 或者，如果我只是对 Zones 做了一些完全错误的事情，请告诉我。这对我来说是全新的

Answer 1

1) run 对比 runOutsideAngular

调用 runOutsideAngular 时，更改检测不会在您的插件启动异步操作（setTimeout、evetns、XHR 等）后触发。

当调用 run 时（更好的方法是直接调用 3rdPartyWidgetStart）变化检测将在任何异步操作之后执行。

选择适合您的项目的任何方式（即您是否需要运行 CD 在 setTiemout、事件、......之后？）。

2) 清除setTimeouts

你可以做的是通过一个 ZoneDelegate 分叉当前区域，它会累积计时器 ID 并在你的 ngOnDestroy.

中取消它们

但是解决这个问题的最好方法可能是修复 jQuery 插件。

Answer 2

我应该说，您自己承担风险。直接使用区域：

    Zone.current.fork({
        name: 'jquery', onScheduleTask: (parentZoneDelegate: ZoneDelegate, currentZone: Zone, targetZone: Zone,
                                                  task: Task)=>
        {
            if(task.source === 'setInterval'){
                console.log('capture', task);
                //data has handleId property, interval id
                this.interval = task.data; 
            }
            return parentZoneDelegate.scheduleTask(targetZone, task);
        }
    }).run(()=>
    {
        setInterval(()=>
        {
            console.log('jquery interval', Zone.current);
        }, 5000);
    });

代码中某处：

clearInterval(this.interval.handleId);

此代码很可能缺少一些检查，请阅读文档。我也不确定 angular 是否可以接受。

是否可以清除 NGZone 中设置的所有间隔？

Is it possible to clear all intervals set within NGZone?

javascript

zone

typescript

angular