API 参考手册
API > @angular/animations

AnimationEvent

An instance of this class is returned as an event parameter when an animation callback is captured for an animation either during the start or done phase.

查看"说明"...

      
      interface AnimationEvent {
  fromState: string
  toState: string
  totalTime: number
  phaseName: string
  element: any
  triggerName: string
  disabled: boolean
}

说明

@Component({ host: { '[@myAnimationTrigger]': 'someExpression', '(@myAnimationTrigger.start)': 'captureStartEvent($event)', '(@myAnimationTrigger.done)': 'captureDoneEvent($event)', }, animations: [ trigger("myAnimationTrigger", [ // ... ]) ] }) class MyComponent { someExpression: any = false; captureStartEvent(event: AnimationEvent) { // the toState, fromState and totalTime data is accessible from the event variable } captureDoneEvent(event: AnimationEvent) { // the toState, fromState and totalTime data is accessible from the event variable } }
      
      
  1. @Component({
  2.   host: {
  3.     '[@myAnimationTrigger]': 'someExpression',
  4.     '(@myAnimationTrigger.start)': 'captureStartEvent($event)',
  5.     '(@myAnimationTrigger.done)': 'captureDoneEvent($event)',
  6.   },
  7.   animations: [
  8.     trigger("myAnimationTrigger", [
  9.        // ...
  10.     ])
  11.   ]
  12. })
  13. class MyComponent {
  14.   someExpression: any = false;
  15.   captureStartEvent(event: AnimationEvent) {
  16.     // the toState, fromState and totalTime data is accessible from the event variable
  17.   }
  18.  
  19.   captureDoneEvent(event: AnimationEvent) {
  20.     // the toState, fromState and totalTime data is accessible from the event variable
  21.   }
  22. }

属性

属性说明
fromState: string

The name of the state from which the animation is triggered.

toState: string

The name of the state in which the animation completes.

totalTime: number

The time it takes the animation to complete, in milliseconds.

phaseName: string

The animation phase in which the callback was invoked, one of "start" or "done".

element: any

The element to which the animation is attached.

triggerName: string

Internal.

disabled: boolean

Internal.