Angular中的Overlay CDK可用于在应用程序中创建弹出框，工具提示和下拉菜单等内容。 在某些情况下，您可能会遇到Overlay CDK未正确附加到原点的问题。 这可能是由于命名冲突或另一个Angular指令正在与Overlay CDK冲突而导致的。

以下是一些可能的

1. 检查Overlay CDK directive是否已添加到所需的模块中。 如果未添加，可以通过将其添加到 NgModule 的 @NgModule.decorators 中来解决问题：

import { OverlayModule } from '@angular/cdk/overlay';

@NgModule({ imports: [OverlayModule], // ... }) export class AppModule { }

2. 确保所需的组件中已正确安装了Angular CDK directive。 在下面的示例中，我们要向用户显示一个工具提示：

import { Component, OnInit } from '@angular/core'; import { Overlay } from '@angular/cdk/overlay'; import { ComponentPortal } from '@angular/cdk/portal';

@Component({ selector: 'app-tooltip', template: 'Hover me for tooltip' }) export class TooltipComponent implements OnInit { private tooltipOverlay: any;

constructor(private overlay: Overlay) {}

ngOnInit(): void {}

showTooltip() { const tooltipPortal = new ComponentPortal(TooltipOverlayComponent); this.tooltipOverlay = this.overlay.create({ positionStrategy: this.overlay.position().connectedTo( document.querySelector('.cdk-overlay-origin')!, { originX: 'start', originY: 'bottom' }, { overlayX: 'start', overlayY: 'top' } ), scrollStrategy: this.overlay.scrollStrategies.close(), }); this.tooltipOverlay.attach(tooltipPortal); }

hideTooltip() { if (this.tooltipOverlay) { this.tooltipOverlay.detach(); } } }

在这个例子中，我们使用了this.overlay.create()方法创建了一个overlay。 该overlay使用了connectedTo()方法沿着元素的底部边缘定位了组件。 请注意，我们使用了选择器.cdk-overlay-origin来定位元素。 您可以使用与此类似的方式调整代码来解决您的问题。

3. 您可以尝试更新Angular包。 有时，升级Angular包可以解决冲突和错误。

通过使用这些解决