How do I select element that's currently visible
My attempt was like this:
app.component.html
<ScrollView>
<StackLayout>
<StackLayout width="100%" *ngFor="let item of images$">
<Image #image [src]="item.url" stretch="aspectFill" colSpan="3" row="0"></Image>
</StackLayout>
</StackLayout>
</ScrollView>
app.component.ts
@ViewChildren('image') image: QueryList<Image>;
ngAfterViewInit(): void {
this.image.changes.subscribe((changes) => {
alert("current:" + this.image.toArray()[0]);
alert("current:" + this.image.toArray()[0].src);
}
);
}
It alerts only once.
Basically the goal is to trigger API's exposed by Image when scrolled to position of an item in view.