0

我是新手,正在尝试学习 Backbone.js,但我遇到了这个错误:

无法将“this.model”转换为对象

我正在尝试为音频播放器构建一个简单的架构,但这个错误让我很生气!不明白为什么会这样,但是浏览器控制台在 ListOfSongsView 的 this.model.bind("reset", this.render, this) 行显示错误。

这是我的代码:

$(function () {    
    var Player = Backbone.Model.extend({
        defaults:{
             //blablabla
        }
    });     
    var Playlist = Backbone.Collection.extend({ 
        model: Player
    });    
    var MyPlaylist = new Playlist([ 
        { 
            //blablabla
        }
//here comes more songs
    ]);     
    var ListOfSongsView = Backbone.View.extend({                    
        tagName: 'ul',
        id: "tracks",        
        initialize: function () {
            this.model.bind("reset", this.render, this);
            var self = this;
            this.model.bind("add", function (player) {
                $(self.el).append(new OneSongView({model:player}).render().el);
            });
        },       
        render: function (eventName) {
            _.each(this.model.models, function (player) {
                $(this.el).append(new OneSongView({model:player}).render().el);
            }, this);
            return this;
        }
    });      
    var OneSongView = Backbone.View.extend({     
        tagName: "li",
        calssName: "clearfix",   
        template:_.template($('#tpl-one-song').html()),      
        initialize: function () {
            this.model.bind("change", this.render, this);
        },       
        render: function (eventName) {
            $(this.el).html(this.template(this.model.toJSON()));
            return this;
        }        
    });     
    var AppRouter = Backbone.Router.extend({    
        routes:{
            "": "list",
            "!/": "list"
        },      
        initialize: function () {
            $('#block').html(new ListOfSongsView().render().el);
        },          
        list: function () {
            this.playlist = new Playlist();
            this.ListOfSongsView = new ListOfSongsView({model:this.playlist});
            this.playlist = MyPlaylist;
            $('#block').html(new ListOfSongsView().render().el);
        }           
    });      
    var app = new AppRouter();
    Backbone.history.start();    
});

我做错了什么?请帮帮我,我的头已经裂了:(

4

1 回答 1

0
initialize: function () {
        $('#block').html(new ListOfSongsView().render().el);
    }

这称为您构建 AppRouter 的那一刻。您在 ListOfSongsView() 的参数中没有传递模型,因此 this.model 是未定义的。

然后调用视图的初始化:

 initialize: function () {
        this.model.bind("reset", this.render, this);
        var self = this;
        this.model.bind("add", function (player) {
            $(self.el).append(new OneSongView({model:player}).render().el);
        });
    },

this.model 是未定义的,所以你不能在它上面调用 bind。

于 2013-05-25T23:52:56.867 回答