Youtube iframe api를 사용하여 onStateChange 이벤트 처리기에 데이터를 전달하는 방법

Question

웹 사이트 용 javascript로 작은 비디오 플레이어를 제작할 예정입니다. json의 비디오 목록이 있습니다. 내 플레이어를 인스턴스화합니다

var Videoplayer = new myVideoPlayer(data); 

이 목록에는 vimeo 및 youtube의 비디오가 포함되어 있으므로이 개체 안에 api 두 개를 모두 처리하고 싶습니다. 내가 좋아하는 기능을 가지고 내부의

setVideo(videoId) 

선택하고 비디오를 재생하거나

markVideoAsSelected(video) 

는 HTML에 클래스를 추가합니다.

지금까지 모든 것이 부드럽게 진행되었지만 지금은 벽을 치고 있습니다. 내가 API를 통해 YouTube 플레이어를로드 할 때, 나는 내가 원하는

events : { 
    'onStateChange': self.YTonStateChange 
} 

모든 것은 내가 처음에 만든 위해 VideoPlayer 인스턴스에 바인딩 추가 할 수 있습니다. 상태 변화에, 나는이 실행

YTonStateChange : function(e){ 
    var self = this 
    switch(e.data){ 
     //Video ended code 0 
     case 0: 
      setTimeout(self.switchToNextVideo, 3000); 
     break; 
    } 
} 

문제 :

이 이제 유튜브 API에서 이벤트에 바인딩 및 내 개체를 잃게됩니다. 나도 몰라, 어떻게 이벤트 처리기에 이벤트와 함께 내 개체 인스턴스를 전달할 수 있습니다! 거기에 더 많은 단계를 위해 필요한 것들이 있습니다. 어떻게 다시 얻을 수 있습니까?

events : { 
    'onStateChange': self.YTonStateChange.bind(self) 
} 

그것은 YTonStateChange 콜백에서 '자기'을 '이'값을 강제로 :

Answer 1

은 그냥 그렇게 '자아'에 컨텍스트를 바인딩합니다. 희망이 도움이됩니다;)