代码之家 › 专栏 › 技术社区 › Neel Basu

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

underscore.js backbone.js javascript

0

Neel Basu · 技术社区 · 13 年前

我有我的模型

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

首次渲染柱廊视图时 addOne 获取一个客户端作为参数,因为它是通过addAll调用的。但下次什么时候 addOne(加一) 通过调用 add 我在检查员中看到的事件 item 不是 client

r{cid:“c606”,属性:对象,集合:r,_changing:false,_previousAttributes:Object}

1 回复 | 直到 13 年前

1

0

nilgun 13 年前

我想我已经解决了你的问题。

以下是您的代码: 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/

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