在角度2中动画结束后的函数回调

npm install @angular/animations --save

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
  imports: [
    // ... other imports
    BrowserAnimationsModule
  ],
  // ... other configurations
})
export class AppModule { }

import { Component, OnInit } from '@angular/core';
import { trigger, state, style, animate, transition } from '@angular/animations';

@Component({
  selector: 'app-animation-example',
  template: `
    <div [@myAnimation]="animationState" (animationend)="onAnimationEnd()">
      Animate me!
    </div>
  `,
  animations: [
    trigger('myAnimation', [
      state('inactive', style({
        backgroundColor: '#eee',
        transform: 'scale(1)'
      })),
      state('active', style({
        backgroundColor: '#cfd8dc',
        transform: 'scale(1.1)'
      })),
      transition('inactive => active', animate('1000ms ease-in')),
      transition('active => inactive', animate('1000ms ease-out'))
    ])
  ]
})
export class AnimationExampleComponent implements OnInit {
  animationState = 'inactive';

  ngOnInit() {
    this.animationState = 'active';
  }

  onAnimationEnd() {
    console.log('Animation has ended!');
    // 在这里执行你的回调逻辑
  }
}