1

私は backbone.js を学んでおり、最初のマルチモジュール アプリを構築しています。今までに見たことのないエラーが発生しました。理由はわかっていると思いますが、修正方法がわかりません。モデルがまだビューで実際に使用できないためだと思いますが、その理由はわかりません。

エラーは次のとおりです。

キャッチされていない TypeError: Object function (){ return parent.apply(this, arguments); メソッド「toJSON」がありません

これは、私のビュー msg.App.MessageListItemView の 11 行目です。

これが私のモデルです：

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;

私はありとあらゆる提案を探しています。私は初心者です。これは私の最初のマルチモジュール アプリなので、スコープの管理に少し問題があると思います。

ありがとう！

4

1 に答える 1

1

モデルを変更してみてください: msgApp.MessageのmsgApp.MessageListViewを次のようにします。

// 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);
}

ビューのモデル パラメータは、モデルのタイプではなく、何らかのモデルのインスタンスを想定しています。お役に立てれば。

于 2013-06-07T07:09:49.060 に答える