angular1.x onyoutubeiframeapiready

Question

我正在使用angular js 1.x开发网站。

我正在使用youtube iframe API播放youtube视频。

这是我的问题。

当我第一次进入播放页面时，按视频播放按钮可以看到youtube视频。

然后返回到上一页，重新进入相​​同的播放页面，然后再次按播放按钮以查看错误消息，如下所示。

“播放时出现问题。（播放ID：***）点击重试”

当我重复上述步骤时，总是会发生这种情况。 但是当我刷新页面时，视频正常播放。

我通过谷歌搜索分辨率，但没有其他结果。 恐怕这是一个编程问题。

这是我的代码。

-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'，function（$ ocLazyLoadProvider）{         $ ocLazyLoadProvider.config（{             调试：是的，             事件：是的，             模块：[{                 名称：“ YouTubeApp”，                 文件：[                     HOMEPAGE_ROOT +'/webpage/bower_components/angular-youtube/angular-youtube.js'                 ]             }]         }）;     }]）;

每次进入播放页面时都可以播放视频而不刷新吗？

任何帮助将不胜感激。

谢谢。