在进行媒体查询时，当我尝试使用有角度的材质菜单组件时，我出现了掉队行为。
我有一个自定义的媒体查询，我会根据它的响应呈现一些html。
首先，我有一个菜单项。当页面重新加载时，可以通过单击大小按钮打开菜单。之后，当我点击菜单面板时，它会像预期的那样消失。但是，当我调整窗口大小以触发媒体查询匹配并单击大小按钮时，菜单项会打开，但当我在页面中单击它时不会关闭。
更清楚地说，我添加了一个名为"普通"的按钮来测试意外行为，并意识到这个按钮上似乎没有这种奇怪的行为。
这相当复杂，因为我为此创建了一个stackblitz页面。
只需按下按钮，你就会看到一个菜单项将被渲染，然后点击菜单面板，它将消失。然后调整窗口大小，以便触发媒体查询，大小按钮将不会对关闭菜单产生任何影响。
https://stackblitz.com/edit/angular-qswyoq
如果您进入区域，似乎可以工作：
https://stackblitz.com/edit/angular-i3eb7q?file=src/app/app.component.ts
我的猜测是，因为媒体更改后的点击处理程序绑定在区域外，所以菜单在区域外初始化，用于关闭菜单的事件不会触发更改检测。