Un ejemplo de la animación de Angular 2 terminó la función de devolución de llamada

Estoy tratando de crear una función que se activará al final de una animación en Angular 2 (estoy usando el último cli angular).

He estado en elAnimaciones angulares para obtener una cierta comprensión de cómo se implementaría esto asignando el disparador con una devolución de llamada en mi ejemplo de código, tengo un componente que está animado en la página. el código es tiene sigue:

//first.component.ts

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


@Component({
  selector: 'app-first',
  templateUrl: './first.component.html',
  styleUrls: ['./first.component.css'],
  host: {
    '[@routeAnimation]': 'true',
    '[style.display]': "'block'",
    '[style.position]': "'absolute'"
  },
  animations: [
    trigger('routeAnimation', [
      state('*', style({transform: 'translateX(0)', opacity: 1})),
      transition('void => *', [style({transform: 'translateX(-100%)', opacity: 0}),animate(500)]),
      transition('* => void', animate(500, style({transform: 'translateX(100%)', opacity: 0})))
    ])
  ]
})
export class FirstComponent implements OnInit {

  constructor() { }

  ngOnInit() {

  }

  myFunc() {
  // call this function at the end of the animation.
 }

}

el html es simplemente un div

<div class="w9914420">
  <h2>
     first-component Works!
  </h2>
</div> 

Para ser honesto, no estoy demasiado familiarizado con JavaScript, por lo que cualquier ayuda o un ejemplo rápido me ayudaría a comprender mejor Angular 2.

Respuestas a la pregunta(2)

Su respuesta a la pregunta