Javascript angular2/4中列表的单个动画延迟

我想为angular2组件中的相同状态设置单独的动画解除播放周期，以便一个项目在另一个项目之后的特定秒后显示

我有以下几个街区

    <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>

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

---

如何使用web动画api实现这种效果

有一个

stagge

helper来帮助元数据。还有

query

，真正实现这一点的是元素的查询列表。您可以查看代码中的

动画预览

分支，甚至可以查看构建。谢谢，我们将查看它。我正在疯狂地试图解决这个问题。对于那些感兴趣的人来说，这里有新的变化。谢谢，我查过了，这正是我所需要的。它是否足够稳定，可以使用？它可能会也可能不会成为4.2版本的AFAIK，如果不是，那么可能是下一个版本。值得注意的是，到目前为止，Angular的每一个版本都将动画API中的大多数内容标记为实验性的。有一个

stagger

元数据助手。还有

query

，真正实现这一点的是元素的查询列表。您可以查看代码中的

动画预览

分支，甚至可以查看构建。谢谢，我们将查看它。我正在疯狂地试图解决这个问题。对于那些感兴趣的人来说，这里有新的变化。谢谢，我查过了，这正是我所需要的。它是否足够稳定，可以使用？它可能会也可能不会成为4.2版本的AFAIK，如果不是，那么可能是下一个版本。值得注意的是，到目前为止，Angular的每个版本都将动画API中的大多数内容标记为实验性的。

 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'})
            ]))
            )
        ])