用于封装YouTube iFrame API的Angular服务 - loadVideoById()引发异常

时间:2013-12-19 19:04:59

标签: javascript angularjs iframe youtube-api youtube-iframe-api

Cdoe:

(function(){
    angular.module('youtubeAPI', []).
    run(function() {
        var tag = document.createElement('script');
        tag.src = "//www.youtube.com/iframe_api";
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    }).
    service('YtPlayerApi', ['$window', '$rootScope', function ($window, $rootScope) {
        var ytplayer = {"playerId":null,
        "playerObj":null,
        "videoId":null,
        "height":'100%',
        "width":'100%'};

        $window.onYouTubeIframeAPIReady = function () {
            this.APIloaded = true;
        };
        ytplayer.readyState = function(){
            return this.APIloaded;  
        }
        ytplayer.setVideoID = function(videoId){
            this.videoId = videoId;
        },
        ytplayer.getVideoId = function(){
            return this.videoId;
        },
        ytplayer.getApi = function(){
            return this;
        },
        ytplayer.setPlayerId = function(elemId) {
            this.playerId=elemId;
        },
        ytplayer.setVideo = function(videoId) {
                console.log( this.playerObj);
                this.playerObj.loadVideoById(videoId);      
        },  
        ytplayer.loadPlayer = function () {

                this.playerObj = new YT.Player(this.playerId, {
                     height: this.height,
                     width: this.width,
                     videoId: this.videoId
                 });
                this.APIloaded = true;

        }
        return ytplayer;
    }]);
})()

一旦我调用'setVideo',我得到的错误如下:

TypeError: Object #<S> has no method 'loadVideoById' at Object.ytplayer.setVideo (http://localhost:8000/js/youtube.js:36:23) at Object.fn (http://localhost:8000/js/controllers.js:2939:33) at h.$get.h.$digest (http://localhost:8000/lib/angular/1.2.5/angular.min.js:98:396) at h.$get.h.$apply (http://localhost:8000/lib/angular/1.2.5/angular.min.js:101:157) at HTMLInputElement.h (http://localhost:8000/lib/angular/1.2.5/angular.min.js:123:493) at HTMLInputElement.x.event.dispatch (http://localhost:8000/js/jquery.min.js:5:14129) at HTMLInputElement.x.event.add.v.handle (http://localhost:8000/js/jquery.min.js:5:10866)

注销对象给了我:

Y {b: wb, a: iframe#ytPlayer, o: null, closure_uid_613255056: 2, u: 2…} D: Object a: iframe#ytPlayer b: wb closure_uid_613255056: 2 d: 43 g: N h: "player" i: Object k: Object o: null s: Array[0] t: true u: 2 __proto__: c

非常感谢任何帮助!

0 个答案:

没有答案