angular2 / 4

Question

我想为angular2组件中的状态设置单独的动画deplay时段，以便在certian秒后显示一个项目。

我有以下块

    <div class="cloud-detials" *ngIf="screen">
         <div class="col" [@fadeInLeft]="slide"></div>
         <div class="col" [@fadeInLeft]="slide"></div>
         <div class="col" [@fadeInLeft]="slide"></div>
   </div>

所有都具有相同的动画效果

 trigger('fadeInLeft', [
            state('inactive', style({ animationName: 'fadeInLeft'})),
            transition('* => active', animate(800, keyframes([
                    style({ opacity: 0, transform: 'translate3d(-100%, 0, 0)'}),
                    style({ opacity: 1, transform: 'none'})
            ]))
            )
        ])

我希望每个块在设定的秒数之后显示在前一个块之后。

如何使用网络动画api实现这样的效果？