Question

我是我的模特

var Client = Backbone.Model.extend({});
var Colony = Backbone.Collection.extend({
    url: '/presence/knock',
    model: Client
});

视图

var ClientView = Backbone.View.extend({
    initialize: function(){
        this.render();
    },
    template: _.template('...'),
    render: function(){
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    }
});
var ColonyView = Backbone.View.extend({
    initialize: function(){
        _.bindAll(this, 'addOne', 'addAll');

        this.collection.bind('add', this.addOne);
        this.collection.bind('refresh', this.addAll);
        this.collection.bind('change', this.addAll);
    },
    addOne: function(item){
        console.log('addOne', item);
        var view = new ClientView({
            model: item
        });
        $(this.el).append(view.render().el);
    },
    addAll: function(){
        var self = this;
        this.collection.each(function(item){
            self.addOne(item);
        });
    },
    render: function(){
        this.addAll();
        return this;
    }
});

我用/presence/knock上的彗星更新了该集合。

var colony = new Colony([{
    ip: '127.0.0.1',
    name: 'localhost.localdomain',
    lsup: 'now'
}]);
setInterval(function(){
    colony.fetch({
        update: true
    });
}, 5*1000);

var colonyView = new ColonyView({
    collection: colony
});
$("#clients-board").append(colonyView.render().el);

第一次渲染colonyview时addOne获取客户端作为参数，因为它通过addAll调用。但下次通过addOne事件调用add时，我在检查员item中看到的不是client

r {cid：“c606”，属性：对象，集合：r，_changing：false，_previousAttributes：Object ...}

Answer 1

我想我发现了你的问题。

以下是您的代码的工作小提琴：http://jsfiddle.net/nilgundag/KbwHZ/

我使用了mockjax来模拟服务器以及它返回的内容：

[{
    ip: '127.0.0.1',
    name: 'localhost.localdomain',
    lsup: 'now'
},
{
    ip: '127.0.0.2',
    name: 'localhost.localdomain',
    lsup: 'now'
}]

由于您说您正在获取Object {clients：Array [1]}，因此您的服务器可能会返回：

[{
        clients:[{
                ip: '127.0.0.1',
                name: 'localhost.localdomain',
                lsup: 'now'
        }]
}]

以下是演示您案例的小提琴：http://jsfiddle.net/nilgundag/TxZxp/

您应该将服务器代码更改为仅发送客户端数组，而不是包含属性客户端和关联数组的对象。

骨干集合视图添加未使用模型调用

1 个答案: