Angular 角度2：ChangeDetection和mousemove事件

我有一个有很多孩子的角2分量。 由于性能问题，我想检查

变更检测

检查我的子组件的频率。因此，我记录了我的一个子组件的

ngAfterViewChecked

-回调

我意识到我的父组件有一个

mousemove（）

-回调，因此每当我将鼠标移到父组件上时，我的孩子的

ngAfterViewChecked

都会被调用。但是我不会在我的

mousemove（）

-回调中更新任何组件变量。为什么

ChangeDetection

会为孩子们运行，我如何才能阻止它

---

我希望您能理解这个问题（如果没有，请发表评论，以便我能澄清问题）。

peeskillet提供的网站展示了如何将eventlistener排除在ChangeDetection之外：

import { Component, NgZone } from '@angular/core';

@Component(...)
export class AppComponent {
...
  element: HTMLElement;

  constructor(private zone: NgZone) {}

  mouseDown(event) {
  ...
    this.element = event.target;

    this.zone.runOutsideAngular(() => {
      window.document.addEventListener('mousemove', this.mouseMove.bind(this));
    });
  }

  mouseMove(event) {
    event.preventDefault();
    this.element.setAttribute('x', event.clientX + this.clientX + 'px');
    this.element.setAttribute('y', event.clientX + this.clientY + 'px');
  }
}

---

对于进一步的信息，我真的可以推荐这个。大THX皮锅

太多了，正是我在寻找的！对我来说也是一样，mousemoves引起重新排序的内容包含Highcharts图形。谢谢，我尝试将

区域。runOutsideAngular（..

）放在事件处理程序中。这帮助我解决了手头的问题。这取决于你想在事件侦听器中做什么。并非所有用例都需要单独的区域。但很高兴它能为你工作。