集合是模型的有序组合,我们可以在集合上绑定 "change" 事件,从而当集合中的模型发生变化时fetch(获得)通知,集合也可以监听 "add" 和 "remove" 事件, 从服务器更新。
创建/添加/删除集合
// 创建集合
var Book = Backbone.Model.extend({
defaults: {
name: ''
}
});
var BookList = Backbone.Collection.extend({
model: Book,
url: 'http://localhost:8001/service'
});
var book1 = new Book({
name: 'Effective Java'
});
var book2 = new Book({
name: 'Java核心技术'
});
var book3 = new Book({
name: 'JavaScript语言精粹'
});
var books = new BookList([book1, book2, book3]);
console.log(books.models);
// 添加
books.add({
name: 'add1'
});
// 添加到尾部
books.push({
name: 'push1'
});
// 添加到头部
books.unshift({
name: 'unshift1'
});
console.log(books.models);
// 删除
books.remove(books.models[2]);
// 移除尾部
books.pop();
// 移除头部
books.shift();
console.log(books.models);
从服务器获取集合数据
// 从服务器获取集合数据
books.fetch({
success: function (collection, resp) {
console.dir(collection.models);
}
});
// 创建一个新模型,并同步到服务器
books.create({
name: 'Thinking in Java',
price: 395.70
}, {
success: function (model, resp) {
console.log(books.models);
}
});
将数据批量同步到服务器
// 将数据批量同步到服务器
var Bok = Backbone.Model.extend({
defaults: {
name: '',
price: 0
}
});
var BokList = Backbone.Collection.extend({
model: Bok,
url: '/service',
getIds: function () {
return _(this.models).map(function (model) {
return model.id;
}).join(',');
},
createAll: function (options) {
return Backbone.sync.call(this, 'create', this, options);
},
updateAll: function (options) {
return Backbone.sync.call(this, 'update', this, options);
},
deleteAll: function (options) {
var result = Backbone.sync.call(this, 'delete', this,
_.extend({
url: this.url + '/' + this.getIds()
}, options));
this.remove(this.models);
return result;
}
});
var boks = new BokList();
boks.on('reset', function () {
boks.createAll();
boks.updateAll();
boks.deleteAll();
})