Angular Material：在对话框上显示sidenav

Question

我正在寻找一种在 MatDialog 上显示 MatSidenav 的解决方案。我的项目，移动优先，是用两个 sidenavs 构建的，左和右，用于推送内容。

在底部，有一个固定页脚，可以打开左侧或右侧导航栏。

在主要内容中，我需要使用 MatDialog。

我的目的是能够打开一个 MatDialog，并且能够打开左侧的 sidenav，因为我想检查一些关于我的帐户的信息，然后关闭它以返回到仍然打开的对话框。

现在，对话框始终显示在内容上方。

这是一个Stackblitz来清楚地解释我的问题：

重现案例：

• 点击“选择一个”按钮
• 对话框打开
• 在页脚中，单击“打开左侧菜单”
• 左侧导航推送主要内容但显示在对话框下方

除了 MatDialog 的 Z 位置及其关联覆盖之外，一切都像我想要的那样工作，最好的办法是像处理主要内容一样“推动”它。

理想的做法是找到一种方法将对话框及其覆盖“附加”到主要内容。我找到了一种使用 Angular 4.4 的方法，但是对于 Angular 8 这样的较新版本，这似乎不起作用。