ユーザーがYouTubeビデオ(ここに投稿された質問)を一時停止した時間をキャプチャするために、Angular2のonYouTubeIframeAPIReadyコールバックメソッドを使用していることに気付きました。
私はこことここで概説されているのと同様の問題を抱えています。
私はアドバイスに従い、結局を使用しました(window as any).onYouTubeIframeAPIReady = function () {}
。
ただし、onYouTubeIframeAPIReadyメソッドには、次のコードがあります。
function onYouTubeIframeAPIReady() {
player = new YT.Player('video', {
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
タイプスクリプトリンターから次のエラーが発生します。
タイプの引数 '{events:{' onReady ':( event:any)=> void; 'onStateChange' :( event:any)=> void;};} 'はタイプ' PlayerOptionsのパラメーターに割り当てることができません
私の最小限のレポの例はここにあります:
git clone https://github.com/Atticus29/dataJitsu.git
cd dataJitsu
git checkout stackoverflow
npm install
ng serve
のwindow['YT']
代わりに使用すると、YT
これが解決するようです:
ngOnInit() {
var player;
window['onYouTubeIframeAPIReady'] = function() {
player = new window['YT'].Player('video', {
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event){
if (event.data == window['YT'].PlayerState.PAUSED) {
console.log(player.getCurrentTime());
}
}
function onPlayerReady(event) {
document.getElementById("pause").addEventListener("click", function() {
player.pauseVideo();
});
document.getElementById("play").addEventListener("click", function() {
player.playVideo();
});
}
if (!window['YT']){
var tag = document.createElement('script');
tag.src = "//www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
}
}
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加