弹出框不保留，页面滚动时位置保持不变（Angular 4+）答案

【问题标题】：Popover doesn't stay, and position stays while page scrolls (Angular 4+)弹出框不保留，页面滚动时位置保持不变（Angular 4+）
【发布时间】：2023-03-20 03:41:01
【问题描述】：

当我单击一个图标时，会显示一个弹出框。我意识到弹出框设置了延迟，但是当我滚动时，弹出框也会移动。如何让它保持在图标所在的位置而不使用滚动？

<md-badge class="current-plan-type__icon--badge" direction="right" [mdPopover]="tootltipTemplate" delay="10000"
popoverTrigger="MouseEnter">
 <i class="cui-icon icon icon-info_16 current-plan-type__icon--info"></i>
</md-badge>

【问题讨论】：

您能否提供demo 以便更容易为您提供帮助。
stackoverflow.com/questions/13250325/show-hide-div-on-scroll
您是否尝试使用选项 data-container="body" 或 [container] ="body" ？如果不是问题，另一种解决方案是将弹出框元素移出模板中的根 div 元素，或者只是移出滚动 div。
是的，所以我没有使用 boostrap，我使用的是另一个库

标签： html css angular popover

【解决方案1】：

只需将 tootltipTemplate 移到可滚动的 div 之外，即使不在同一级别也会调用它。

我认为你有这个问题：可滚动 div 内的弹出框模板。

<div #root>
   <div #scrolleable>
       <div #tootltipTemplate></div>
   </div> 
</div>

那么我的建议是：移出可滚动div的popover模板。

<div #root>
   <div #scrolleable>       
   </div> 
   <div #tootltipTemplate></div>
</div>

我希望它对你有用。

【讨论】：

那行不通，我需要这样的答案，但对于打字稿：stackoverflow.com/questions/13250325/show-hide-div-on-scroll