Javascript 使用窗口时捕获div id：滚动

我有一个angular 8应用程序，我正在尝试使用window:scroll功能在滚动到达特定组件时加载组件。我可以通过使用window.pageYOffset实现这一点，但由于组件的高度是动态的window.pageYOffset没有帮助。有没有办法通过标识id或其他东西来标识滚动条是否已到达该组件？我可以使用事件捕获id吗

这就是我所尝试的：

@HostListener('window:scroll', ['$event']) onScroll(event) {
    if (window.pageYOffset >= 350) {
        this.scrollPointReached = true;
    }
}

---

不要为此使用滚动事件侦听器，请使用

使用此选项，您可以在容器在视口中变为可见（或离开视口不再可见）时收听

首先，使用首选选项创建一个新的观察者：

let选项={
rootMargin:'0px'，
阈值：1.0
}
让observer=新的IntersectionObserver（回调，选项）；

然后设置需要监视的元素：

let singleTarget=document.querySelector（“#observeTarget”）；
观察者。观察（目标）；
让multiTargets=document.querySelectorAll（'.targets'）；
多目标.forEach（目标=>observer.observe（目标））

最后定义元素进入视图时发生的情况：

let callback=（条目，观察者）=>{
entries.forEach（entry=>{
//每个条目描述了一个观察到的交叉点的变化
//目标要素：
//entry.isIntersecting
//entry.rootBounds
});
};

这里有一篇关于如何使用的帖子，只是你能找到的众多帖子中的一篇

---

请记住，如果您必须支持IE，您不能使用这种方法，那么您必须以某种方式使用滚动事件来实现您自己的逻辑。

谢谢您的帮助，但我不能使用滚动事件侦听器吗？您可以，但IO性能更高，如果您希望滚动侦听器具有良好的性能，您必须取消滚动侦听器的抖动。另外，如回答中所述，如果你需要支持IE，你必须使用scroll listener。我只需要它在Chrome中工作。然后使用IO。也有现成的用于angular的指令，也许这会使您更容易使用。但我从来没有使用过这个指令，所以我不能说这是否好（但从我在github上看到的情况来看，它看起来很活跃）