I'm trying to detect when an HTML video
ends in Ionic2 (Angular2 and Typescript). My code snippets are below:
Template:
<video poster="" id="v" playsinline autoplay webkit-playsinline onended="vidEnded()">
<source src="assets/vid.mp4" type="video/mp4">
</video>
Component:
vidEnded() {
console.log("video ended");
this.leavePage();
}
What am I doing wrong? Thanks in advance.
In Angular 2, you need to add -
between prefix on
and event name, or simply remove prefix on
and surround event name with ()
bind an event. So, correct syntax in your case would be one of these two, you can use whichever you prefer because both do the same thing:
on-ended="vidEnded()"
(ended)="vidEnded()"
Check out Angular 2 binding syntax.
You can detect when a Html video ends in Angular in this way:
Template:
<video (ended)="videoEnd()">
<source src="assets/vid.mp4" type="video/mp4">
</video>
Component:
videoEnd() {}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With