Angular2設置音頻currentTime的組分

Question

下面是創建HTML 5音頻元素的HTML內容：

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

下面是我正努力將當前時間一些默認值，註釋的代碼組件工作正常，但請建議如何做同樣的事情Angular2的方式？

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; 
    } 
} 

Answer 1

AudioComponent應與@Component（{...}）裝飾不@Injectable（）

@Component({ 
selector: 'my-audio-player', 
templateUrl: ` 
    <audio id ="audio2"controls="controls" autoplay="false" 
    (canplay)="CanPlay($event)"> 
     <source src="http://localhost:51657/Audio/1" type="audio/mp3"> 
</audio> 
` 
}) 
export class AudioComponent implements OnInit { ... }