2
votes

I have a CompositeView where I fetch its collection on initialize.

  initialize: function() {
    this.collection = this.model.things;
    this.collection.fetch();
  },

How do I not render this composite view if its collection is empty?

I'm aware of the EmptyView, but that still renders the composite view's template. I want to not render anything if the collection is empty.

2

2 Answers

4
votes

The answer ended up being to render the composite view after the fetch's deferred objected returned.

initialize: function() {
  var self = this;
  this.collection = this.model.localFoods;
  this.collection.fetch().then(function() {
    self.render();
  });
}

Current score

async:23, me:0

Async wins!

0
votes

From the Docs:

When the collection's "reset" event is fired, it will only re-render the collection within the composite, and not the wrapper template

So pass {reset: true} to the fetch(), so the collection will automatically be re-rendered:

initialize: function() {
    this.collection = this.model.things;
    this.collection.fetch({reset: true});
}