API-интерфейс Angra 2+ Youtube с существующей привязкой iframe [src] не может запускать события - PullRequest
1 голос
/ 07 марта 2019

У меня проблема с тем, что 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";

Может кто-нибудь помочь мне понять, почему это происходит? Само видео воспроизводится при нажатии кнопки воспроизведения, но оно не воспроизводится автоматически и не предупреждает пользователя о завершении видео.

Спасибо!

...