diff --git a/src/core/events-strategy.ts b/src/core/events-strategy.ts index 1c07c63f1..4b1fe464f 100644 --- a/src/core/events-strategy.ts +++ b/src/core/events-strategy.ts @@ -18,7 +18,11 @@ export class NgEventsStrategy { fireEvent(name, args) { let emitter = this.getEmitter(name); if (emitter.observers.length) { - this.ngZone.run(() => emitter.next(args && args[0])); + if (this.ngZone.isStable) { + this.ngZone.run(() => emitter.next(args && args[0])); + } else { + emitter.next(args && args[0]); + } } } diff --git a/src/core/integration.ts b/src/core/integration.ts index d9cd3261e..63d763661 100644 --- a/src/core/integration.ts +++ b/src/core/integration.ts @@ -1,16 +1,29 @@ -import { NgModule, Inject } from '@angular/core'; +import { NgModule, Inject, NgZone } from '@angular/core'; import { DOCUMENT } from '@angular/common'; import * as domAdapter from 'devextreme/core/dom_adapter'; import * as readyCallbacks from 'devextreme/core/utils/ready_callbacks'; +const events = ['mousemove', 'mouseover', 'mouseout', 'scroll']; @NgModule({}) export class DxIntegrationModule { - constructor(@Inject(DOCUMENT) document: any) { + constructor(@Inject(DOCUMENT) document: any, ngZone: NgZone) { domAdapter.inject({ _document: document, + listen: function(...args) { + if (events.indexOf(args[1]) === -1) { + return ngZone.run(() => { + return this.callBase.apply(this, args); + }); + } + + return ngZone.runOutsideAngular(() => { + return this.callBase.apply(this, args); + }); + }, + isElementNode: function(element) { return element && element.nodeType === 1; }, @@ -24,6 +37,6 @@ export class DxIntegrationModule { } }); - readyCallbacks.fire(); + ngZone.run(() => readyCallbacks.fire()); } }