Below is the html content which creates HTML 5 audio element:

  <audio id ="audio2"controls="controls" autoplay="false" (canplay)="CanPlay($event)">
            <source src="http://localhost:51657/Audio/1" type="audio/mp3"> 
</audio>

Below is the component in which I am trying set the current time to some default value, the commented code is working fine, however please suggest how to do same thing the Angular2 way?.

    import { OnInit, Output,Component, Injectable, EventEmitter } from '@angular/core';
    declare let $: any;
@Component({
    selector: 'audio-tag',
  templateUrl: './audio-tag.component.html',
})

@Injectable()
export class AudioComponent implements OnInit {
 @Output() canplay: EventEmitter<any> = new EventEmitter();
   audio:any;
    playBtn: any;
    pauseBtn: any
    currentTime:any;
    timer:any;
    duration:any;

    sound: any;
    ngOnInit(): void {
//     $('#audio2').bind('canplay', function() {
//   this.currentTime = 20;
// });
          }       

    CanPlay(){
      console.log('canplay');        
      this.currentTime=10;
      this.audio.currentTime = 20;
    }
}