typescript - Detectar cuando un video HTML termina en Angular 2

Estoy tratando de detectar cuándo termina un video HTML en Ionic2 (Angular2 y Typescript). Mis fragmentos de código están abajo:

Plantilla:

<video poster="" id="v" playsinline autoplay webkit-playsinline onended="vidEnded()">
    <source src="assets/vid.mp4" type="video/mp4">
</video>

Componente:

vidEnded() {
    console.log("video ended");
    this.leavePage();
}

¿Qué estoy haciendo mal? Gracias de antemano.

Respuesta #1

En Angular 2, necesitas añadir - entre el prefijo on y el nombre del evento, o simplemente eliminar el prefijo on y rodear el nombre del evento con () para enlazar un evento. Por lo tanto, la sintaxis correcta en tu caso sería una de estas dos, puedes usar cualquiera de las dos porque ambas hacen lo mismo:

• on-ended="vidEnded()"

• (ended)="vidEnded()"

Consulta la sintaxis de enlace de Angular 2.

Respuesta #2

Puedes detectar cuándo termina un video HTML en Angular de esta manera:

Plantilla:

<video (ended)="videoEnd()">
  <source src="assets/vid.mp4" type="video/mp4">
</video>

Componente:

videoEnd() {}