Trigger ngFor Animation on Scroll Angular 6
Trigger ngFor Animation on Scroll Angular 6 I'm basically making an Angular 6 application that olds an array of items and displays them using *ngFor. What I want is to animate then one by one when the window is on certain position (Y offset), this is, begin the animation when the window is on certain Y position. The following code perfectly makes the animation for each item (show on after another, whit an animation), but is being triggered as soon as the component loads. How can I hold the items animation until the window is on certain Y position? trigger('fadeListAnimation', [ transition('* => *', [ query(':enter', style({ opacity: 0, transform: 'scale(0.9)' }), { optional: true } ), query(':enter', stagger(150, [ animate('.15s ease-out', keyframes([ style({ opacity: 0, transform: 'scale(0.9)' }), style({ opacity: 1, transform: 'scale(1)' }) ...