Backbone.collection (collection)
Collection is an ordered combination of model objects, and we can bind a "change" event to the collection so that when the model in the collection changes, the collection can also listen for "add" and "Remove" events, update from the server, and be able to use Underscore.js provides the method.
Create a collection
Custom Collection Object var book = Backbone.Model.extend ({ defaults:{ title: ' Backbone ', Author: ' Jeremy ashkenas ' }}) var Books = Backbone.Collection.extend ({ model:book}) var booklist = [ {title: ' iOS ', Author: ' Apple '}, { Title: ' Android ', author: ' Google '}, {title: ' Windows Phone ', Author: ' Microsoft '}]//custom var books = new Books ( Booklist)//Iterate through the model Books.each in the collection (function (book) { console.log (Book.tojson ()) //console.log (Book.get (' title ') + '/' + book.get (' author ')})//instantiation of the collection object var book = Backbone.Model.extend ({ defaults:{ title: ' Backbone ', Author: ' Jeremy Ashkenas '} }) var Booklist = [ {title: ' iOS ', Author: ' Apple '}, {title: ' Android ', author: ' Google '}, {title: ' Windows Phone ', Author: ' Microsoft '}]//instancing var books = new Backbone.collection (booklist,{ Model:book})// Iterate through Model Books.each (function (book) { console.log (Book.tojson ())}) in the collection
Action Collection
to remove a model from a collection
Remove collection.remove(models, [options])
Deletes a model (or a model array) from the collection, and returns them. the "Remove" event is triggered and can also be closed using silent . The index of the model can be used as a Options.index class listener before removal.
Pop collection.pop([options])
Deletes and returns the last model in the collection.
Shift collection.shift([options])
Deletes and returns the first model in a collection.
var book = Backbone.Model.extend ({ defaults:{ title: ' Backbone ', Author: ' Jeremy Ashkenas ' }}) var Booklist = [ {title: ' iOS ', Author: ' Apple '}, {title: ' Android ', author: ' Google '}, {title: ' Windows Phone ', Author: ' Microsoft '}]var books = new Backbone.collection (booklist,{ Model:book}) Books.shift ()//delete 1th model// Books.remove (Books.models[0]) Books.pop ()//delete the last 1 models of Xu Books.each (function (book) { console.log (Book.tojson ())})
add a model to the collection
Add collection.add(models, [options])
Adds a model (or an array of models) to the collection, triggering an "add" event. If you have defined the Model property, you can also make it look like a model instance through the object of the original property. Returns the (or pre-existing, if repeated) pattern that has been added. Pass {At:index} to insert the model into a specific index position in the collection. If you want to add the models that already exist in the collection to the collection, they will be ignored unless you pass {merge:true}, in which case their properties will be merged into the corresponding model, triggering any appropriate "change " events.
Push collection.push(model, [options])
Adds a model at the end of the collection.
unshift collection.unshift(model, [options])
Adds a model to the head of the collection.
var book = Backbone.Model.extend ({ defaults:{ title: ' Backbone ', Author: ' Jeremy Ashkenas ' }}) var Booklist = [ {title: ' iOS ', Author: ' Apple '}, {title: ' Android ', author: ' Google '}, {title: ' Windows Phone ' , Author: ' Microsoft '}]var books = new Backbone.collection (booklist,{ Model:book}) Books.add ({title: ' Java ', Author: ' xxx '})//Add 1 model default tail Books.push ({title: ' C + + ', Author: ' CCC '})//Add 1 models to tail Books.unshift ({title: ' PHP ', Author: ' PPP '})//Add 1 models to head Books.each (function (book) { console.log (Book.tojson ())})
find a model in a collection
Get collection.get(id)
Get the model in the collection either by an ID, a CID, or by passing in a module.
at collection.at(index)
Gets the model for the specified index in the collection. Whether or not you reorder the model, at always returns the index value when it is inserted in the collection.
where collection.where(attributes)
Returns an array of all the models in the collection that match the passed attributes(attributes). is useful for simple filter (filtering) .
Findwhere collection.findWhere(attributes)
Just like where, the difference is that findwhere directly returns the first model that matches the passed attributes (property).
var book = Backbone.Model.extend ({ defaults:{ code:0, title: ' Backbone ', Author: ' Jeremy Ashkenas ' }, idattribute: ' Code '}) var booklist = [ {code:1,title: ' iOS ', Author: ' Apple '}, {code:2,title: ' Android ', author: ' Google '}, {code:3,title: ' Windows Phone ', Author: ' Microsoft '}]var books = new Backbone.collection (booklist,{ Model:book})//books.at (2) Console.log (Books.get (1). ToJSON () ) // Object {code:1, title: "ios", Author: "Apple"}console.log (books.at (1). ToJSON () ) //object {code:2, title: "A Ndroid ", Author:" Google "}_.each (Books.where ({title: ' Windows Phone '}), function (book) { console.log ( Book.tojson ())}) //object {code:3, title: "Windows Phone", Author: "Microsoft"}console.log (Books.findwhere ({ Title: ' Windows Phone '}). ToJSON ())//object {code:3, title: "Windows Phone", Author: "Microsoft"}
Sort The model in the collection
Sort collection.sort([options])
Forces a reordering of the collection. In general, you do not need to call this function, because when a model is added, the comparator function is sorted in real time. To disable sorting when adding a model, you can pass {sort:false} to add. Call sort to trigger the "sort" event of the collection.
Comparator collection.comparator
By default, the collection does not declare the comparator function. If the function is defined, the model in the collection is sorted according to the specified algorithm.
var book = Backbone.Model.extend ({ defaults:{ code:0, title: ' Backbone ', Author: ' Jeremy Ashkenas ' }}) var Booklist = [ {code:7,title: ' iOS ', Author: ' Apple '}, {code:5,title: ' Android ', author: ' Google '}, {code : 6,title: ' Windows Phone ', Author: ' Microsoft '}]var books = new Backbone.collection (booklist,{ Model:book, Comparator:function (A, b) { return a.get (' code ') > B.get (' Code ')? 1:0;//Ascending //return a.get (' code ') > B.G ET (' Code ')? 0:1; Descending }}) Books.sort () Books.each (function (book) {
interacting with the server
Get Server data
FETCH  collection.fetch ([options])
Pull collection default model settings from the server, The collection is setting (set) when the data is successfully received.
var book = Backbone.Model.extend ({ defaults:{ code:0, title: ' Backbone ', Author: ' Jeremy Ashkenas ' }}) var Books = Backbone.Collection.extend ({ URL: ' backbone-test.php ', Model:book, initialize:function () { //reset Event Trigger this.on (' Reset ', function (render) { _.each (render.models,function (book) { Console.log (Book.tojson ())})})}) var books = new Books () Books.fetch ({ reset:true, Success:function (collection, response) { _.each (collection.models,function (book) { console.log ( Book.tojson ())} )} )//php file $json = Array ( ' code ' + 1, ' title ' = ' iOS ', ' author ' = ' Apple '), Array (' Code ' = 2, ' title ' = ' Android ', ' author ' + ' Android '), Array (' Code ' = 3, ' title ' = = ' windows Phone ', ' author ' = ' Microsoft '); Echo Json_encode ($json);
Synchronizing Server data
Create collection.create(attributes, [options])
Easily create a new instance of a model in the collection. It is equivalent to instantiating a model with a property hash (key-value object), and then saving the model to the server, and then adding the model to the collection after the creation succeeds, returning the new model.
var book = Backbone.Model.extend ({ defaults:{ code:0, title: ' Backbone ', Author: ' Jeremy Ashkenas ' }}) var Books = Backbone.Collection.extend ({ URL: ' backbone-test.php ', Model:book, initialize:function () { this.on (' Add ', function (model,response) { console.log (Model.tojson ())//object {title: "ios", Author: " Apple ", code:0}} ) }) var books = new Books () Books.create ({title:" ios ", Author:" Apple "})//php File// Sets the format of the received Data header (' Content-type:application/json; Charset=utf-8 '); Gets the data sent by the client $data = Json_decode (file_get_contents ("Php://input"));/* Gets the value of each property and saves it to the server *///return the update successful flag echo Json_ Encode (Array (' Code ' = ' 2 '));
Meet Backbone (III)