Angular CDK Overlay - dispose 和 detach 有什么区别？

Question

我使用 Angular Material CDK Overlay 创建了一个悬停时显示的工具提示，但我的性能受到了严重影响，它使我的应用程序非常慢。经过一些研究后，我意识到每次使用处置或分离关闭工具提示时，我都需要清除 overlayRef。

现在，我试图了解这两个函数之间的区别。根据 Angular Material 文档，它们定义如下:

dispose - 从 DOM 中清除叠加层。

detach - 从门户中分离覆盖。

当我尝试使用它们中的每一个时，我看到了相同的结果，所以不确定我应该在什么时候使用哪一个。

Answer 1

detach() - 分离前后。如您所见，创建的 div 仍然存在。

dispose() - 处理前后。创建的 div 已被完全删除。

要在只有一个打开时关闭叠加层，我会说使用 dispose。当你有许多组件打开时覆盖，例如许多不同的弹出窗口，而你只想关闭一个，那么你应该使用分离。但这只有在您有范围覆盖(每个组件)时才有效。