Question

我正在学习backbone.js，我正在构建我的第一个多模块应用程序。我收到了一个我以前从未见过的错误，我想我知道原因，但我看不出如何修复它。我相信这是因为该模型实际上还没有可用于视图，但我看不出原因。

错误是：

Uncaught TypeError：Object function（）{return parent.apply（this，arguments）;没有方法'toJSON'

这是我视图中的第11行，msg.App.MessageListItemView。

这是我的模特：

var msgApp = msgApp || {};

msgApp.Message = Backbone.Model.extend();

这是我的收藏：

var msgApp = msgApp || {};

msgApp.MessageCollection = Backbone.Collection.extend({
    model: msgApp.Message,
    url: MESSAGES_API // Call to REST API with Tastypie
});

这是我的列表视图：

var msgApp = msgApp || {};

msgApp.MessageListView = Backbone.View.extend({

    el: '#gps-app',

    initialize: function() {

        this.collection = new msgApp.MessageCollection();
        this.collection.fetch({reset: true});
        this.render();
        this.listenTo( this.collection, 'reset', this.render );

    },

    // render messages by rendering each message in it's collection
    render: function() {

        this.collection.each(function(item){
            this.renderMessage(item);
        }, this);
    },

    // render a message by creating a MessageView and appending the the element it renders to the messages element
    renderMessage: function(item) {
        var messageView = new msgApp.MessageListItemlView({
            model: msgApp.Message
        });
        this.$el.append(messageView.render().el);
    }

});

这是我的项目视图：

var msgApp = msgApp || {};

msgApp.MessageListItemlView = Backbone.View.extend({

    tagName: 'li',
    className: 'message-list-item',
    template: _.template($('#messageListItem').html()),

    render: function() {
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    }

});

这是我的路由器：

var AppRouter = Backbone.Router.extend({

    routes: {
        'messages/': 'allMessages',
    },

    allMessages:function() {
        this.messageList = new msgApp.MessageCollection();
        this.messageListView = new msgApp.MessageListView({model:this.messageList});
        console.log('I got to messages!');
    },

 });

var app_router = new AppRouter;

我正在寻找任何和所有建议。我是一个初选的菜鸟，这是我的第一个多模块应用程序，所以我在管理范围时遇到一些麻烦。

谢谢你的时间！

Answer 1

尝试在 msgApp.MessageListView 中更改 model：msgApp.Message ，如下所示：

// render a message by creating a MessageView and appending the the element it renders to the messages element
renderMessage: function(item) {
    var messageView = new msgApp.MessageListItemlView({
        model: item
    });
    this.$el.append(messageView.render().el);
}

视图中的模型参数不期望模型的类型，而是某个模型的实例。希望这会有所帮助。

我的视图中没有方法'toJSON'错误

1 个答案: