BackboneJS - Initialisation de la collection

La description

Lorsque l'instance de modèle est créée, elle est appelée en définissant le initialize fonction lorsque la collection est créée.

Syntaxe

new Backbone.Collection(models, options)

Paramètres

models - Il spécifie le tableau initial de modèles.
options - Ce sont les types de collection attachés à la collection directement par l'objet modèle passant.

Exemple

<!DOCTYPE html>
<html>
   <head>
      <title>Collection Example</title>
      <script src = "https://code.jquery.com/jquery-2.1.3.min.js"
         type = "text/javascript"></script>
      
      <script src = "https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
         type = "text/javascript"></script>
      
      <script src = "https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
         type = "text/javascript"></script>
   </head>
   
   <body>
      <script type = "text/javascript">
         //The model 'MyTeam' contains default values and extended using the 
         //Backbone.Model class
         var MyTeam = Backbone.Model.extend ({
            defaults: {
               player: "sachin",
               country: "india"
            },
            
            //The model instance is invoked by defining initialize function
            initialize: function() {
               document.write("Welcome to TutorialsPoint!!!");
            }
         });
         
         //The 'MyTeam1' is a collection instance and model 'MyTeam' is specified by  
         //overriding the 'model' property
         var MyTeam1 = Backbone.Collection.extend ({
            model: MyTeam
         });
         var player1 = new MyTeam ({
            player: "sehwag",
            country: "india"
         });
         
         //The 'player1' is a type of collection by passing model object in the collection
         var myval = new MyTeam1([player1]);

         //The 'myval.models' define the array of models inside the collection
         document.write("<br>"+JSON.stringify(myval.models));
      </script>
      
   </body>
</html>

Production

Exécutons les étapes suivantes pour voir comment le code ci-dessus fonctionne -

Enregistrez le code ci-dessus dans le initialize.htm fichier.
Ouvrez ce fichier HTML dans un navigateur.

↰ Previous page