title: Marionette ItemView trying to render template before fetch in init completes
body: <p><strong>UPDATE</strong></p>
  
  <p>I've created a work around for my project.  I set an empty template to be this views default template (actually contains loading message and throbber in case of any further delays) and set the model change event to replace the views $el html with the groupTemplate when it's ready.  This makes a seemless transition on my dev, test and production box, however, if production gets slow while retreiving the model's data, it will actually get to show the loading message.</p>
  
  <pre><code>define([
    'underscore',
    'backbone',
    'marionette',
    'models/group',
    'text!templates/shared/empty.html', // include empty template
    'text!templates/groups/group.html'
  ], function(_, Backbone, Marionette, groupModel, emptyTemplate, groupTemplate){
    var GroupView = Backbone.Marionette.ItemView.extend({
      initialize: function() {
        var view = this;
  
        this.model = new groupModel({id:this.options.groupid});
  
        // listen to the model change and display the real template when fired.
        this.model.on('change', function(){
          view.$el.html(_.template(groupTemplate, view.model.attributes));
        });
  
        this.model.fetch();
      },
      template: emptyTemplate // display empty template be default
    });
    return GroupView;
  });
  </code></pre>
  
  <p>I have a single layout using nested column layouts (three column in this case).  The nested layouts are called with the corresponding views and it requires those views and shows them in it's own regions. (if there is a better way to do this, please let me know).</p>
  
  <p>My problem is the GroupView for col2 (nested three-column layout) is using an ItemView and is using a model that has no data to start.  The model retreives the data using a url and not from a collection, so a fetch must be used to retreive the data.  The ItemView is trying to render it's template using a model with no data and fails to find the model fields.  Giving me the following error.</p>
  
  <blockquote>
    <p>Uncaught ReferenceError: groupname is not defined</p>
  </blockquote>
  
  <p>Is there a way to delay rendering or does ItemView have an undocumented emptyView like the colletionsView?  If there is a better way to handle this, please let me know.</p>
  
  <p>Router Controller </p>
  
  <pre><code>group: function(groupid) {
    // require and setup our three column layout
    require([
      'views/layouts/three-column', 'views/shared/left-user-menu',
      'views/groups/group', 'views/shared/location'
    ], function(threeColumnLayout, leftView, groupView, locationView) {
    App.wrapper.currentView.main.show(new threeColumnLayout({
      views: {
        col1: new leftView(),
        col2: new groupView({groupid: groupid}),
        col3: new locationView()}
    }));
  }
  </code></pre>
  
  <p>Nested Layout (three-column)</p>
  
  <pre><code>define([
    'underscore',
    'backbone',
    'marionette',
    'text!templates/layouts/three-column.html'
  ], function(_, Backbone, Marionette, threeColumnTemplate) {
    var Layout = Backbone.Marionette.Layout.extend({
      initialize: function(options) {
        var layout = this;
  
        this.on('render', function(options){
          layout.col1.show(options.options.views.col1);
          layout.col2.show(options.options.views.col2);
          layout.col3.show(options.options.views.col3);
        });
      },
      tagName: 'div',
      template: threeColumnTemplate,
      regions: {
        col1: '#col1',
        col2: '#col2',
        col3: '#col3'
      }
    });
  
    return Layout;
  });
  </code></pre>
  
  <p>Group ItemView</p>
  
  <pre><code>define([
    'underscore',
    'backbone',
    'marionette',
    'models/group',
    'text!templates/groups/group.html'
  ], function(_, Backbone, Marionette, groupModel, groupTemplate){
    var GroupView = Backbone.Marionette.ItemView.extend({
      initialize: function() {
        this.model = new groupModel({id:this.options.groupid});
        this.model.fetch();
      },
      template: groupTemplate
    });
    return GroupView;
  });
  </code></pre>