<html>
<head>
<title>backbone.js-Collection</title>
</head>
<body>
</body>
<script src="../../../node_modules/jquery-2.0.2.min.js"></script>
<script src="../../../node_modules/underscore-min.js"></script>
<script src="../../../node_modules/backbone-min.js"></script>
<script>
(function($){
Book = Backbone.Model.extend({
defaults:{
title:'dafaults'
},
initialize:function(){
alert('hey, you create a collection');
}
});
//collection是model的一个有序集合
BookShelf = Backbone.Collection.extend({
model: Book
});
var book1 = new Book({title:'book1'});
var book2 = new Book({title:'book2'});
var book3 = new Book({title:'book3'});
var bookShelf = new BookShelf();
//bookShelf = new BookShelf([book1, book2, book3]);
bookShelf.add(book1);
bookShelf.add(book2);
bookShelf.add(book3);
//bookShelf.remove(book3);
//基于underscore.js这个库.可以同each来获得collection中的数据
bookShelf.each(function(book){
alert(book.get('title'));
});
/*
for(var i=0; i<bookShelf.models.length; i++) {
alert(bookShelf.models[i].get('title'));
}
*/
//reset方法,在模型变化的时候,可将集合替换为新的模型或键值对象
bookShelf.bind('reset', showAllBooks);
bookShelf.fetch({url:'getbooks'}, success:function(collection, response){
collection.each(function(book){
alert(book.get('title'));
});
},error:function(){
alert('error');
});
showAllBooks:function(){
bookShelf.each(function(book){
//渲染到页面
});
}
})(jQuery);
</script>
</html>
455
“相关推荐”对你有帮助么？
-
非常没帮助 -
没帮助 -
一般 -
有帮助 -
非常有帮助
提交
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
