Angularjs1.x YouTube видео воспроизводится только один раз, используя YouTube iframe API

Question

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

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

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

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

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

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

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

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

Вот мой код.

CarDetail.html

<youtube width="743" height="538" videoid="{{item.video_id}}"></youtube>

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);
      }
    };

  });

loading angular-youtube.js

angular.module('app')
  .constant('JQ_CONFIG', { ...
  })
  .config(['$ocLazyLoadProvider', function($ocLazyLoadProvider) {
    $ocLazyLoadProvider.config({
      debug: true,
      events: true,
      modules: [{
        name: 'YouTubeApp',
        files: [HOMEPAGE_ROOT + '/webpage/bower_components/angular-youtube/angular-youtube.js']
      }]
    });
  }]);

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

Любая помощь будет оценена.

Спасибо.