Angular 触发滚动角度6上的动画

我基本上是在制作一个Angular 6应用程序，该应用程序对一个项目数组进行老化，并使用*ngFor显示它们。我想要的是，当窗口位于某个位置（Y偏移）时，逐个设置动画，也就是说，当窗口位于某个Y位置时，开始动画

下面的代码完美地为每个项目制作了动画（一个接一个地显示，带有动画），但在加载组件后立即触发

如何保持项目动画直到窗口位于某个Y位置

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)' })
          ])
        )
      ]),
      { optional: true }
    ),

    query(':leave',
      stagger(150, [
        animate('.15s ease-out',
          keyframes([
            style({ opacity: 1, transform: 'scale(1)' }),
            style({ opacity: 0, transform: 'scale(0.9)' })
          ])
        )
      ]),
      { optional: true }
    )
  ])
]);

---

提前谢谢你

我通过使用

*ngIf