更新时间:2023-10-30 21:10:58
要解决此问题,您需要将cdk版本升级到7.3.7,该版本在OverlayRef上有一个新方法,称为updatePositionStrategy.
To fix this, you need to upgrade your cdk version to 7.3.7 which has a new method on OverlayRef as updatePositionStrategy.
根据此方法,您可以在粘贴后更改叠加层的位置策略.
According to this method you can change the position strategy of an overlay after attach.
在附加组件之后,您需要在show功能中更新位置策略,如下所示:
In your show function after attaching the component you need to update position strategy as below:
this._overlayRef.updatePositionStrategy(this._overlayPositionBuilder
.flexibleConnectedTo(this._elementRef)
.withPositions([{
originX: "center",
originY: "bottom",
overlayX: "center",
overlayY: "top",
offsetY: this.getOffsetY()
}]));
this._overlayRef.updatePosition();
其中this.getOffsetY()是私有方法,根据元素当前位置提供偏移y值.您可能需要更新此逻辑.
where this.getOffsetY() is private method provide offset y value based on element current position. You may need to update this logic.
private getOffsetY() {
if (this._elementRef.nativeElement.getBoundingClientRect().bottom > 500)
return -400;
if (this._elementRef.nativeElement.getBoundingClientRect().bottom > 400)
return -300;
if (this._elementRef.nativeElement.getBoundingClientRect().bottom > 300)
return -200;
return -10;
}
这是stackblitz 链接
Here is stackblitz link