I have a list that adds dynamic components that aren't created until results are returned from the server. After everything is loaded and fetched...the scrollTop of the dynamically added divs are all 0. I assume the dom is unaware of the position of the newly added divs at the time I am trying to determine their position or if what I am trying to do is even possible. <div class="item" *ngFor="let item of list$ | async"> <my-component class="my-comp" [data]="item"></my-component> <div> Then in a function i call when scrolling... the component position always returns 0: onScroll() { const elem = this.ref.nativeElement.querySelector('.my-comp'); console.log(`ELEM: `, elem); console.log(`ELEM SCROLL TOP: `, elem.scrollTop); //Always 0 } My use case is to have dynamically loaded video components where I have control the video play/pause states based on the users scrolling. Again...these components are not created or added until well after the view itself has been created. Any help is much appreciated. Continue reading...
