Angular 角度4覆盖容器副本

在我的项目中，我使用和。 在浏览器中运行代码后，当我打开a或a时，它会将一个

cdk覆盖容器

div添加到页面的

正文

：

<div class="cdk-overlay-container"></div>

---

如何将此容器提供给根组件以确保只有一个

OverlyContainer

？

我认为在这种情况下，您只需分离/处理不再需要的东西即可

const overlayRef = this.overlay.create({....});
.... some other code            
let componentRef = overlayRef.attach(yourcomponent);

Once you're done
componentRef.destroy();

overlayRef.detach();
overlayRef.dispose();

---

您应该能够创建自己的覆盖容器实现，扩展

OverlayContainer

，并在appModule上提供它。例如，您可能希望将覆盖附加到特定组件，而不是将覆盖附加到

这是@Marshal open my eyes的解析答案，创建了一个很好的指令来控制：

此外，您还想看看Bogdan Bogdanov的解决方案：

玩得开心

const overlayRef = this.overlay.create({....});
.... some other code            
let componentRef = overlayRef.attach(yourcomponent);

Once you're done
componentRef.destroy();

overlayRef.detach();
overlayRef.dispose();