Html5 audio tag object reference

Question

Im new to angular 2 and ionic 2 ,Im using audio tags for my project for which in using audio Object

audio: any = new Audio();

In this I'm able to use play(),pause(),currentTime,duration,src,..etc but, in the "ontimeupdate" property if I call the the audio Object

this.audio

it gives me undefined.I need the "ontimeupdate" method to get the audios "currentTime" This is my code.

export class PlayerPage implements OnInit { 
audio: any = new Audio();


 constructor(public navCtrl: NavController, public global: GlobalDataService) 
{}

ngOnInit() {
   //click fn. triggered on btn click
    this.playSong();       
}

 playSong() {
    this.audio.src = "MY AUDIO FILE SRC";
    this.audio.load();
    this.audio.play();
 }

 this.audio.ontimeupdate = function () {
 //gives 'this.audio' as undefined
   console.log(this.audio); 

  console.log(this.audio.currentTime)    
 }  
 }

It gives undefined only in the "ontimeupdate" function else where if console the "this.audio" it shows the result.

It's being asked twice per day. use an arrow function: `this.audio.ontimeupdate = () => { console.log(this.audio); }`. — JB Nizet, Nov 19 '17 at 19:43
Possible duplicate of [How to access the correct \`this\` inside a callback?](https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a-callback) — JB Nizet, Nov 19 '17 at 19:44
thanks @JB Nizet . I surely need to learn a lot in typescript. — deep dalvi, Nov 19 '17 at 19:48
No worries, it's one of the most common pitfalls in JavaScript. — Anthony Mills, Nov 19 '17 at 19:48

Html5 audio tag object reference

0 Answers0