angular1.x onyoutubeiframeapiready

Question

Я разрабатываю веб-сайт, используя Angles JS 1.x.

Я использую API-интерфейс iframe для воспроизведения видео на YouTube.

Вот моя проблема.

КогдаЯ вхожу на страницу воспроизведения в первый раз, я вижу воспроизведение видео с YouTube при нажатии кнопки воспроизведения видео.

Затем вернитесь на предыдущую страницу, повторно войдите в ту же страницу воспроизведения и нажмите кнопку воспроизведения.снова нажмите кнопку, чтобы увидеть сообщение об ошибке, как показано ниже.

"При воспроизведении возникла проблема. (Идентификатор воспроизведения: ***) Нажмите, чтобы повторить попытку"

Это всегда происходит, когда я повторяю вышеописанное.шаг.Но когда я обновляю страницу, видео воспроизводится как обычно.

Я исследую разрешения с помощью поиска в Google, но больше ничего не приблизилось.Боюсь, это проблема программирования.

Вот мой код.

- CarDetail.html

- angular-youtube.js (от http://blog.oxrud.com/posts/creating-youtube-directive/)

angular.module ('YouTubeApp', [])

.constant('YT_event', {
    STOP: 0,
    PLAY: 1,
    PAUSE: 2
})

.directive('youtube', function ($window, YT_event, youTubeApiService) {
    return {
        restrict: "E",

        scope: {
            height: "@",
            width: "@",
            videoid: "@"
        },

        template: '<div></div>',

        link: function (scope, element, attrs, $rootScope) {
            var len = $('script').filter(function () {
                return ($(this).attr('src') == 'https://www.youtube.com/iframe_api');
            }).length;

            if (len === 0) {
                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;

            youTubeApiService.onReady(function () {
                player = setupPlayer(scope, element);
            });

            function setupPlayer(scope, element) {
                return new YT.Player(element.children()[0], {
                    playerVars: {
                        autoplay: 0,
                        html5: 1,
                        theme: "light",
                        modesbranding: 0,
                        color: "white",
                        iv_load_policy: 3,
                        showinfo: 1,
                        controls: 1
                    },

                    height: scope.height,
                    width: scope.width,
                    videoId: scope.videoid

                });
            }

            scope.$watch('videoid', function (newValue, oldValue) {
                if (newValue == oldValue) {
                    return;
                }

                if (typeof player !== "undefined") {
                    // player.cueVideoById(scope.videoid);
                }
            });

            scope.$watch('height + width', function (newValue, oldValue) {
                if (newValue == oldValue) {
                    return;
                }

                if (typeof player !== "undefined") {
                    player.setSize(scope.width, scope.height);
                }
            });

            scope.$on(0, function () {
                if (typeof player !== "undefined") {
                    player.seekTo(0);
                    player.stopVideo();
                }
            });

            scope.$on(1, function () {
                if (typeof player !== "undefined") {
                    player.playVideo();
                }
            });

            scope.$on(2, function () {
                if (typeof player !== "undefined") {
                    player.pauseVideo();
                }
            });
        }
    };
})

.factory("youTubeApiService", function ($q, $window) {

    var deferred = $q.defer();
    var apiReady = deferred.promise;

    $window.onYouTubeIframeAPIReady = function () {
        deferred.resolve();
    };

    return {
        onReady: function (callback) {
            apiReady.then(callback);
        }
    };

});

- загрузкаangular-youtube.js

angular.module ('app') .constant ('JQ_CONFIG', {...}) .config (['$ ocLazyLoadProvider', функция ($ ocLazyLoadProvider) {$ ocLazyLoadProvider.config ({debug: true, события: true, модули: [{name: 'YouTubeApp', файлы: [HOMEPAGE_ROOT + '/webpage/bower_components/angular-youtube/angular-youtube.js']}]});}]);

Можно ли воспроизводить видео каждый раз, когда я вхожу на страницу воспроизведения без обновления?

Любая помощь будет признательна.

Спасибо.