Backbone.js eliminar colección

En este artículo, analizaremos la eliminación de Backbone.js de la colección. La colección de eliminación de Backbone.js se usa para eliminar un modelo o una array de modelos de la colección dada.

Sintaxis:

collection.remove(models,options)    

Parámetros: Tomará dos parámetros.

  • modelos: este es el primer parámetro que se utiliza para especificar los nombres de las instancias, 
  • opciones: este parámetro toma el tipo de modelo que se eliminará de la colección dada.

Ejemplo 1: En este ejemplo, crearemos un modelo Food y eliminaremos food1 usando el método remove.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Example of Backbone.js</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>
    <script type="text/javascript"> 
         // 'Food' is a model and that contains the
         // default value for the  model 
         var Food = Backbone.Model.extend({ 
            defaults: { 
               food_name: "Butter", 
               food_region:"Hyderabad" 
            } 
         }); 
   
         // Here the  'FoodCollection' is a collection instance and model
         // 'Food' is specified by overriding the 'model' property 
         var FoodCollection = Backbone.Collection.extend({ 
            model: Food 
         }); 
   
         // The instances "food1" and "food2" are created
           // for the model "Food"
         var food1 = new Food({name: "Icecream", 
                               country:"Hyderabad"}); 
         var food2 = new Food({name: "cake/chocos", 
                               country:"Guntur"}); 
   
         // The add() method adds the models 'food1' and 'food2' to
         // the collection instance 'final' 
         var final = new FoodCollection(); 
         final.add([food1,food2]); 
   
         // Get the count of total food using length 
         document.write('Actual Food Count : ' +
                        final.length); 
         document.write("<br>"); 
   
         // Remove food1 model using remove 
         final.remove([food1]); 
         document.write('Removed Food Count : ' +
                        final.length); 
      </script> 
</head>
 
<body></body>
 
</html>

Producción:

Actual Food Count : 2
Removed Food Count : 1

Ejemplo 2: en este ejemplo, crearemos un modelo Food y eliminaremos food1 y food3 usando remove:

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>Example of Backbone.js remove</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>
    <script type="text/javascript">
        // 'Food' is a model and that contains the
        // default value for the  model 
        var Food = Backbone.Model.extend({
            defaults: {
                food_name: "Butter",
                food_region: "Hyderabad"
            }
        });
 
        // Here the  'FoodCollection' is a collection instance and model
        // 'Food' is specified by overriding the 'model' property 
        var FoodCollection = Backbone.Collection.extend({
            model: Food
        });
 
        // The instances "food1","food2" and "food3" are
        // created for the model "Food" 
        var food1 = new Food({
            name: "Icecream",
            country: "Hyderabad"
        });
        var food2 = new Food({
            name: "cake/chocos",
            country: "Guntur"
        });
        var food3 = new Food({
            name: "drinks",
            country: "Guntur"
        });
 
        // The add() method adds the models 'food1' and
        // 'food2' to the collection instance 'final' 
        var final = new FoodCollection();
        final.add([food1, food2, food3]);
 
        // get the  food using toJSON 
        document.write('Actual Food : ' +
            JSON.stringify(final.toJSON()));
        document.write("<br>");
        document.write("<br>");
 
        // Remove food1 and food3 model using remove 
        final.remove([food1, [food3]]);
 
        // Get the  food using toJSON 
        document.write('After Removal of food1 and food3 : ' +
            JSON.stringify(final.toJSON()));
    </script>
</head>
 
<body></body>
 
</html>

Producción:

Actual Food : [
    {"name":"Icecream","country":"Hyderabad",
        "food_name":"Butter","food_region":"Hyderabad"},
    {"name":"cake/chocos","country":"Guntur",
        "food_name":"Butter","food_region":"Hyderabad"},
    {"name":"drinks","country":"Guntur",
        "food_name":"Butter","food_region":"Hyderabad"}
]

After Removal of food1 and food3 : [
    {"name":"cake/chocos","country":"Guntur",
        "food_name":"Butter","food_region":"Hyderabad"},
    {"name":"drinks","country":"Guntur",
        "food_name":"Butter","food_region":"Hyderabad"}
]

Publicación traducida automáticamente

Artículo escrito por bhanusivanagulug y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *