必须使用window.variableName并且不确定原因

时间:2017-01-24 20:58:12

标签: javascript angularjs youtube-api

我正在使用JS,Angular和Meteor开发一个使用Youtube api的网络应用程序。在我的一个控制器的构造函数中,我按照youtube api进程创建了youtube播放器对象。但是,当我试图引用看似全球化的玩家时,#34;对象在同一控制器内的后续函数中,似乎超出了范围。

我正在努力解决这个问题好几天,因为"播放器"变量似乎是全局的(没有var继续它),直到我遇到使用window.variableName的做法不满意。如果我使用window.player =,我只能获得playPause函数来识别播放器对象...有没有人知道为什么播放器对象不是已经包含控制器和函数的全局?

我仍在学习javascript范围错综复杂以及ECMA课程风格,所以任何帮助都会受到赞赏。

我的代码:

import Ionic from 'ionic-scripts';
import { _ } from 'meteor/underscore';
import { Meteor } from 'meteor/meteor';
import { MeteorCameraUI } from 'meteor/okland:camera-ui';
import { Controller } from 'angular-ecmascript/module-helpers';
import { Chats, Messages } from '../../../lib/collections';

export default class ChatCtrl extends Controller {
  constructor() {
    super(...arguments);
    this.currentVideoId = this.$stateParams.videoId;
    this.chatId = this.$stateParams.chatId;

    this.isIOS = Ionic.Platform.isWebView() && Ionic.Platform.isIOS();
    this.isCordova = Meteor.isCordova;
    chat = Chats.findOne(this.chatId);

    if (chat.playerType == "Y") {
      window.player = new YT.Player('video-placeholder', {
        videoId: this.currentVideoId,
        events: {
                  'onReady': this.initTimes.bind(this)
              }
      });
    } else if (chat.playerType == "V") {

      var options = {
        id: this.currentVideoId,
        width: 640,
        loop: false
      };

      var player = new Vimeo.Player('vimeo-placeholder', options);
    }

  playPauseToggle() {
    if (player.getPlayerState() == 2 || player.getPlayerState() == 5) {
      player.playVideo();
      this.playPauseValue = "Pause";
    } else if (player.getPlayerState() == 1) {
      player.pauseVideo();
      this.playPauseValue = "Play";
    }
  }

ChatCtrl.$name = 'ChatCtrl';
ChatCtrl.$inject = ['$stateParams', '$timeout', '$ionicScrollDelegate', '$ionicPopup', '$log'];

1 个答案:

答案 0 :(得分:1)

所以问题是您在类构造函数中将播放器定义为局部变量。因此,该变量在其他任何地方都不可见 - 比如在playPauseToggle函数中。

相反,为什么不让你的播放器成为你的类实例的属性?

this.player = new YT.Player('video-placeholder'...

然后

playPauseToggle() {
    if (this.player.getPlayerState() == 2 || this.player.getPlayerState() == 5) {
    ... // replace all occurrences of 'player' with 'this.player'

希望这有帮助!