Angular 6 Scroll Listener重新加载组件

Question

为了尽可能简单地解决这个问题,这是我的方案.

1)我有一个父组件,它有一个ViewContainerRef动态加载父组件中的组件.对于我的用例,parent是一个空的holder页面,它根据一组变量动态地替换另一个页面.

<ng-template #dynamic></ng-template>

2)子组件有一个水平滚动div,看起来类似于以下内容:

<div id="carousel" (scroll)="onScroll($event)"> <!-- List of components --> </div>

只要它与(scroll)侦听器一起滚动,它就会重新加载父组件,因此滚动位置总是会反弹回0,因为它已重新加载.

但是,如果我删除了(scroll)侦听器,则div会滚动而不会出现问题.问题是,我想根据水平滚动位置动态更改页面上的项目.

有没有人对嵌入式组件和滚动侦听器可能出现的问题有任何想法？非常感谢!

Answer 1

我不知道你是否正在注入这样的组件，但这是我尝试解决这个问题。

我使用渲染器来监听子组件中的窗口事件滚动。

堆栈闪电战

别介意我的造型