ngZoneをトリガーする非同期アクション（変更検出につながる）を見つける方法は？

更新のスタックトレースを変更すると、常にに戻りglobalZoneAwareCallbackます。どのようにして変更のきっかけを見つけましたか？

デバッグに関しては、明確な図を用意しておくとよいでしょう。

globalZoneAwareCallbackは、ですべてのイベントコールバックを処理するためにzonejsで宣言された関数capture=falseです。（ところで、capture=trueあるのでglobalZoneAwareCaptureCallback）

つまり、イベントリスナーは最初にこのメソッドを通過します。そのリスナーは、Angular、ユーザー、またはサードパーティのライブラリによってページに追加できます。

Angularでブラウザイベントをリッスンする方法はたくさんあります：

• ブラウザイベントをサブスクライブする <element (event)="callback()">

• @HostListener デコレータ @HostListener('event') callback() {}

• Renderer2.listen 方法

• rxjs fromEvent

• 要素のプロパティを割り当てる element.on<event> = callback

• addEventListenerメソッドelement.addEventListener(event, callback)（このメソッドは、上記の他の多くの方法で内部的に使用されます）

中に入ると、トリガーする必要があるglobalZoneAwareCallbackすべてのゾーンタスクにアクセスできます。

clickイベントを聞いているとしましょうdocument.body：

document.body.addEventListener('click', () => {
   // some code
});

Chrome開発ツールを開いて、明確な状況を把握しましょう。

今発見したこと：

• 各ゾーンタスクにはソースが含まれているため、これが変更をトリガーします

• ターゲットプロパティは、変更をトリガーするオブジェクトを示します

• コールバックプロパティは、変更のハンドラーに導くことができます

別の例を考えて、Angularの方法でクリックイベントを追加してみましょう。

<h2 class="title" (click)="test()">Hello {{name}}</h2>

そのh2要素をクリックすると、次のことが確認できます。

ここで、コールバックプロパティがtestコールバックにすぐに移動せず、からのラッパーを示したことに驚くかもしれません@angular/platform-browser package。そして、他の例も異なる場合がありますが、ZoneTask.sourceのそれはので、あなたがそのような場合に必要なすべてのプロパティは、通常は表示さあなたの変化の根本原因を。