我有这个骨干应用程序,我想在一个视图中显示youtube视频。我通过API和模型动态地获取youtube视频id。到目前为止一切顺利。Youtube播放器得到渲染,但播放器给了我一个错误,表明它没有识别VideoID,即使当我console.log的video_id,它返回正确的video_id。
所以我的视图是这样的:
beforeRender: function() {
var artistvideosModel = new ArtistVideos.ArtistVideosModel();
artistvideosModel.artist_id = this.artist_id;
artistvideosModel.video_youtube_id = this.video_youtube_id;
artistvideosModel.fetch();
},
afterRender: function() {
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
window.onYouTubeIframeAPIReady = function() {
player = new YT.Player('vid', {
height: '390',
width: '640',
videoId: this.video_youtube_id,
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.playVideo();
}
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
}
有人知道这里可能有什么问题吗?请帮助…
Thanks in advance
您需要绑定上下文:
window.onYouTubeIframeAPIReady = _.bind(function() {
player = new YT.Player('vid', {
height: '390',
width: '640',
videoId: this.video_youtube_id,
events: {
onReady: onPlayerReady,
onStateChange: onPlayerStateChange
}
})
}, this);