Question

我遇到window.onScroll事件。该事件从未触发过。

那是我的第一次尝试：

  @override
  void ngOnInit() {

    window.onScroll.listen((Event event) => print("it works.."));
  }

但是它不起作用。

我基本上需要onScroll事件。不多。所以我在HTML中尝试了“老派”方式

第二次尝试：

    <div (scroll)="onScroll()">

       <!--Some content-->

    </div>

但是它也不起作用。

在AngularDart中获得滚动事件的最佳解决方案是什么？

顺便说一下，我使用AngularDart5。

Answer 1

div.onScroll.listen((ev) {
});

这在我的测试中很有效。
您确定要添加监听器的位置实际上是正在滚动的位置吗？

Answer 2

对此问题有多种解决方案。

您需要做的第一件事是获取要从中获取滚动事件的HTML元素的引用。我假装这个元素看起来像下面的样子（在您的组件.html文件中）：

<div>Some scrollable content</div>

据我所知，有两种方法可以在AngularDart中获得对HTML元素的引用。

第一个解决方案：

使用@ViewChild批注。为此，您需要在div上添加template reference variable。我称其为“可滚动”，但是如何调用它取决于您。

<div #scrollable>Some scrollable content</div>

然后将以下属性添加到您的组件类中：

@ViewChild("scrollable")
  Element scrollable;

第二种（但不推荐）解决方案：

向div添加一个ID（ID的名称无关紧要）：通过使用document.getElementById()提供的dart:html获取对div的引用：

Element scrollable = document.getElementById('scrollable')

此解决方案的问题是，据我所知，document在任何AngularDart生命周期挂钩中均不可用。

最后，要收听onScroll元素的scrollable流，只需在组件类中的某处执行以下操作：

something.onScroll.listen((Event event) => print("Hurray, it works :)"))