backbone.js - バックボーン、model.save の後に view.render を呼び出すときに 1 つのフィールドが設定されない

Question

次の問題があります。ユーザーイベント（.twitterDefaultをクリック）でsaveイベントを呼び出します

twitter : {
                    handle : handle,
                    ignore : false
}

次に、success 関数が呼び出され、モデル (klout、twitter、tester) にフィールドを設定します。すべてのフィールドが設定されています (ログ ステートメントはすべて、適切なオブジェクトを出力します。

ただし、次に view.render() を呼び出すと、ここで twitter はもう設定されていません。理由はわかりません。保存後に同期が行われないため、Twitter は上書きされません (さらに、success メソッドが呼び出される前に、Twitter もサーバーに保存されていることを確認しました)。

どんな助けでも大歓迎です！

次のようなコード (読みやすくするために削除されています)

$(関数() {

var ContactModel,
    ContactModelCollection,
    ContactView,
    ContactCollectionView,
    contacts,
    contactCollectionView;

//base model
ContactModel = Backbone.Model.extend({
    defaults : {
    },
    initialize : function() {
    }
});

ContactModelCollection = Backbone.Collection.extend({
    model : ContactModel,
    url : '/api/contacts',
    comparator : function(contact) {
        return contact.get('strength_of_relationship');
    },
    initialize : function() {
    }
});

ContactView = Backbone.View.extend({
    tagName : 'li', //attempting to create a new element
    render: function() {
        var compiled_tmpl = _.template($('#contact-template').html());
        var html = compiled_tmpl(this.model.toJSON());
        console.log('model.get("twitter")=('+JSON.stringify(this.model.get('twitter)'))+')');
        console.log('model.get("klout")=('+JSON.stringify(this.model.get('klout'))+')');
        console.log('model.get("tester")=('+JSON.stringify(this.model.get('tester'))+')');
        this.$el.html(html);
        console.log('rendered view successfully)');
        return this;
    },
    initialize: function() {
        console.log('contactView initalized');
        this.model.bind('change', this.render, this);
        this.model.bind('destroy', this.remove, this);
    },
    events: {
        'click .twitterDefault' : 'assignDefaultTwitterHandle',
    },
    assignDefaultTwitterHandle : function(event) {
        var handle = $(event.currentTarget).data('twitter');
        this.assignTwitterHandle(handle);
    },
    assignTwitterHandle : function(handle) {
        console.log('model assignTwitterHandle. handle='+handle+')');
        var view = this,
            model = view.model;
        model.save({
            twitter : {
                handle : handle,
                ignore : false
            },
            id : model.get('id')
        }, {
            error : function() {
                console.log('saving twitter handle failed');
            },
            success : function(model, response) {
                console.log('response=('+JSON.stringify(response)+')');
                if(response.error) {
                    console.log('error on server ='+response.error);
                }
                if(response.twitter) {
                    console.log('twitter is set');
                    var twitter = {
                        handle : handle,
                        tweet : response.twitter,
                        age : new Date()
                    };
                    console.log('setting twitter to '+JSON.stringify(twitter));
                    model.set('twitter', twitter);
                    model.set('tester', 'tester');
                    console.log('twitter after setting it = '+JSON.stringify(model.get('twitter')));
                    console.log('view\'s model twitter after setting it = '+JSON.stringify(view.model.get('twitter')));
                }

                if(response.klout) {
                    console.log('klout is set');
                    var klout = {
                        topics : response.klout
                    }
                    console.log('setting klout to '+JSON.stringify(klout));
                    model.set('klout', klout);
                }
                if(response.twitter || response.klout) {
                    console.log('Rerendering view after setting klout/twitter');
                    view.render();
                }
            }
        });
    }
});

contacts = new ContactModelCollection;

ContactCollectionView = Backbone.View.extend({
    el : $('#suggestions-list'),
    initialize : function(){
        contacts.bind('add', this.addOne, this);
        contacts.bind('reset', this.addAll, this);
        contacts.bind('all', this.render, this);
    },
    render : function(){
        console.log('contactcollectionview render');
    },
    addOne : function(contact) {
        console.log('addOne');
        var view = new ContactView({model: contact});
        var el = view.render().el;
        console.log('el=('+el+')');
        $('#suggestions-list').append(el); 
    },
    addAll : function() {
        console.log('addAll');
        contacts.each(this.addOne);
    }
});

contactCollectionView = new ContactCollectionView;


App.contacts = contacts;
App.contactCollectionView = contactCollectionView; });

Answer 1