v-on (shorthand: @)

When used on a normal element, it listens to native DOM events only. When used on a custom element component, it also listens to custom events emitted on that child component.

So, you could attach an event listener like this:

<video @timeupdate="onTimeUpdateListener" src="..."></video>

Here is an example where I'm using the MediaElement library:https://jsfiddle.net/248nqk02/

This would be the Vue-esque way to assign HTML elements to the app:

<video v-el:video-element controls>    <source src="mov_bbb.mp4" type="video/mp4"></video>

This resolved to a variable this.$els.videoElement in the app. More info here.

Now, to add listeners and functions for them, I'd do something like that:

...ready: function() {    this.addListeners();},methods: {    addListeners: function() {        console.log('adding listeners');        this.$els.videoElement.addEventListener('timeupdate',this.videoTimeUpdated,false);    },    videoTimeUpdated: function() {        console.log('video time updated');    }}...

Obviously, you could put everything video (or any other event related) stuff in a separate component (not directive, in Vue) to keep the code a bit more neat.