2017-08-28 93 views
2

HTML我怎樣才能得到HTML5視頻持續時間頁面加載角4?

<video #v > 
    <source src="{{video.videoUrl}}" type="video/mp4" /> 
</video> 

<button (click)="getDuration(v)"> 
    Get Duration 
</button> 

<input type="range" step="0.1" min="0" 
    max="getDuration(v)"> 

.TS

video = { 
    videoUrl :"myvideo.mp4" 
    length: null, 
} 

getDuration(v){ 
    let dur = v.duration; 
    dur = dur.toFixed(); 

    this.video.length = dur; 
    return dur; 
} 

我可以得到視頻的網址上按一下按鈕,但我不能在頁面加載得到。

如何在頁面加載視頻時獲取視頻持續時間?

加:我試着打電話給getDuration(v)功能ngOnInit()但得到的錯誤,因爲getDuration(v)有參數。

謝謝!

回答

4
  1. 您需要等到元素被加載。使用ngAfterViewInit()生命週期鉤子代替ngOnInit()

  2. 使用@ViewChild裝飾器在打字稿邏輯中使用模板中的元素引用。

在你的情況下,使用ViewChild:

@ViewChild('v') v; 

ngAfterViewInit() { 
console.log(this.v); 
} 
+0

謝謝您的回答。但我不明白如何使用ViewChild的東西?你能更詳細地瞭解如何使用它嗎? – Norx

+0

查看更新的答案 – TheUnreal

+0

順便說一下,它與** ElementRef **一起工作。只想說。 '@ViewChild('v')v:ElementRef;''this.getDuration(this.v.nativeElement)' – Norx

相關問題