When to destroy my model in case of multiple views depending on it

Question

I have a case where I am creating multiple views for a single model. When I close a view, I am removing the model from the collection.

But in case of multiple views, there are other views that depend on the model.

So, how can I know when there are no views depending on the model? When should I destroy the model in case of multiple views?

Answer 1

Though this is not a proper way but still you can achieve this following

1. Declare dependentViews in your model's defaults

   var myModel = Backbone.Model.extend({
       defaults: function() {
           return {
               dependentViews: 0
           };
       }
   });
   

2. In initialization of each view, increment the dependentView

   var view1 = Backbone.View.extend({
       initialize: function() {
           this.model.set("dependentViews",
               this.model.get("dependentViews") + 1);
       }
   });
   
   
   var view2 = Backbone.View.extend({
       initialize: function() {
           this.model.set("dependentViews",
               this.model.get("dependentViews") + 1);
       }
   });
   

3. On close of view decrement dependentViews and on each view destroy, just check the value of dependentViews. If it is 0, remove the model from the collection.

   onCloseView: function() {
       this.model.set("dependentViews",
           this.model.get("dependentViews") - 1);
   
       if (this.model.get("dependentViews") === 0) {
           //remove model  from collection
       }
   }
   

Answer 2

Generally speaking the lifecycle of a view shouldn't cause a model/collection to be modified, but assuming you have a good reason for it.

Here is a slight improvement on Kenny's answer, I'd suggest to have dependentViews as an array on the object, not a value in the attributes (if Views aren't persisted, best not persist view dependencies).

var myModel = Backbone.Model.extend({
    initialize: function() {
         this.dependentViews = [];
    },

    addDependentView: function(view) {
        this.dependentView.push(view);
    },

    closeDependentView: function(view) {
        this.dependentViews = _.without(this.dependentViews, view);

        if (_.isEmpty(this.dependentViews)) {
             //remove model  from collection
        }
    }
})

var view1 = Backbone.View.extend({
    initialize: function() {
          this.model.addDependentView(this);
    }
})


var view2 = Backbone.View.extend({
    initialize: function() {
          this.model.addDependentView(this);
    }
})

...

onCloseView: function() {
    this.model.closeDependentView(this);
} 

Also an array of objects might come in handy for the dependency list, that way you could if necessary in future, make calls from the model to the dependent views.

Another possible solution might be to use the internal event listener register as a means of tracking any objects listening to the model. But that would be more involved and would depend on internal functionality within Backbone.

Answer 3

Having the number of views inside the data model as suggested in other answers is not a good idea.

I have a case where I am creating multiple views for a single model

So you have a "place" where you create views, and destroy these views. This could be a parent view, controller, router instance etc.

If you don't have one then you need one.

You must be having references to these view instances for future clean up.

If you don't have it then you need it.

When you're destroying a view just check the remaining number of instance, if there are none then remove the model (If the view removes itself in response to some user action then it needs to notify the parent of removal).

This is something that should take place outside the view instances and model.