全体的に私がやっていることは、クリックが本体にバブルアップする日付ピッカーがあり、本体のクリックをリッスンしてメニューを閉じる列メニューを持つ ag-grid もあります。plunkr を参照してください。DOB の横にあるハンバーガーをクリックしてフィルターに移動し、日付ピッカーをクリックして日付を選択するだけです。メニューが閉じないことに注意してください。app.component にイベント リスナーが追加されているため、開いたままになります。これにより、イベントが本体に到達すると、イベントがグリッドに伝播されなくなります。私が理解しているように、すべてが機能します。
https://plnkr.co/edit/QDUVOUEHJYMNSumVFICc?p=preview
document.body.addEventListener('click', event => {
if (~event.srcElement.outerHTML.indexOf('mat-calendar-body')) {
event.preventDefault();
event.stopPropagation();
event.stopImmediatePropagation();
}
});
私が抱えている問題は、アプリでまったく同じ設定が機能しないことです。イベント ハンドラーは正しい順序で呼び出されますが、何らかの理由で同じハンドラーを使用してイベントをキャンセルした後でも、アプリで何らかの理由でグリッドがイベントを取得してメニューを閉じます。ここで私が探しているのは、私が見ている動作の原因についてのいくつかのアイデアです。明らかに、私は plunkr をセットアップしてデモンストレーションを行いますが、それは動作しないようで、アプリ全体をアップロードできるため、できません。