在角度cdk叠加层上获得有效位置？

Question

有没有办法使附着的组件覆盖有效位置？例如，我说要在上方打开一个工具提示，但这无法完成，覆盖层将在下面打开。我想从工具提示中添加一个指向我的元素的箭头，现在如果覆盖层位于元素上方/下方，则需要正确定位箭头

Answer 1

ConnectedPositionStrategy（不建议使用）具有onPositionChange属性，而 FlexibleConnectedPositionStrategy具有positionChanges属性，我们无法在创建叠加层之前订阅此可观察对象，因此，解决方案是在创建叠加层之后进行订阅：

const positionStrategy = this.overlay
    .position()
    .flexibleConnectedTo(this.selectHeader)
    .withPositions([
     {
        originX: 'start',
        originY: 'bottom',
        overlayX: 'start',
        overlayY: 'top',
      },
      {
        originX: 'start',
        originY: 'top',
        overlayX: 'start',
        overlayY: 'bottom',
      },
    ]);
this.panelOverlay = this.overlay.create({positionStrategy});
positionStrategy.positionChanges.subscribe(pos => console.log(pos));