У меня проблема с тем, что API-интерфейс iframe youtube не запускает обратные вызовы событий для существующего iframe.
Если я использую:
<div id="player"></div>
Работает
Но если я использую:
<iframe id="player" [src]="mainVideo | sanitize"
width="560" height="315" frameborder="0" allowfullscreen></iframe>
Он не загружает никаких обратных вызовов событий, таких как автозапуск или оповещение, когда человек закончил видео.
HTML
<iframe id="player" [src]="mainVideo | sanitize"
width="560" height="315" frameborder="0" allowfullscreen></iframe>
Машинопись
ngAfterViewInit() {
const doc = (<any>window).document;
let script = doc.createElement('script');
script.type = 'text/javascript';
script.src = 'https://www.youtube.com/iframe_api';
doc.body.appendChild(script);
console.log(script);
}
ngOnInit() {
(<any>window).onYouTubeIframeAPIReady = () => {
console.log((<any>window).YT);
this.player = new (<any>window).YT.Player('player',
{
events: {
'onReady': (e) => {
e.target.playVideo();
},
'onStateChange': (e) => {
if (e.data === 0) {
alert('done');
}
}
}
});
}
}
MainVideo
this.mainVideo = "http://www.youtube.com/embed/"
+ this.sect[0].mainVideoUrl + "?origin=http://localhost:56194&enablejsapi=1";
Может кто-нибудь помочь мне понять, почему это происходит? Само видео воспроизводится при нажатии кнопки воспроизведения, но оно не воспроизводится автоматически и не предупреждает пользователя о завершении видео.
Спасибо!