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

Question

我使用 Angular Material CDK Overlay 创建了一个在悬停时显示的工具提示，但我的性能受到了严重影响，这让我的应用程序变得非常缓慢。经过一番研究，我意识到每次关闭工具提示时都需要使用 dispose 或 detach 清除 overlayRef。

现在，我试图了解这两个函数之间的区别。根据角度材料文档，它们定义如下：

dispose - 从 DOM 中清除覆盖。

detach - 从门户中分离覆盖。

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

Answer 1

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

dispose() - 在 dispose 之前和之后。创建的 div 已被完全删除。

为了在您只打开一个时关闭覆盖，我会说使用 dispose。 当您使用覆盖打开许多组件时，例如许多不同的弹出窗口并且您只想关闭一个，那么您应该使用分离。但这只有在您有范围覆盖（每个组件）时才有效。