代码之家  ›  专栏  ›  技术社区  ›  Patricio Vargas

检测css关键帧何时完成-角度

  •  0
  • Patricio Vargas  · 技术社区  · 6 年前

    我有一个动画,持续一秒钟,我有一个 @Input 我要,但是 @输入 发生的太快以至于动画无法发生。如何知道动画何时完成以触发

    @keyframes bulkSlideOut {
      100% {
        transform: translateY(100vh);
      }
    }
    

    HTML格式

    <div *ngIf="displayBulkPay" class="bulk-pay-storage-container">
      <div class="header-container">
      .
      .
      </div>
    </div>
    

    @Input()
    displayBulkPay: boolean;
    
    1 回复  |  直到 6 年前
        1
  •  1
  •   Zuriel    6 年前

    动画触发器中有一个.start和.done事件,您可以使用它调用函数或设置值。

    <div id="whatever" [@displayBulkPay]="canDoAFunctionToo(anything)"
         (@displayBulkPay.start)="onStart($event)"
         (@displayBulkPay.done)="onDone($event)">