Render a Marionette region after model has been fetched

Question

I would like to use the approach described by Derick Bailey in \"A Generic Problem Solution\" in this thread to render a view after a model is fetched. I wi

Answer 1

I have come up with a slightly different approach. I neede my views to load their own models on initalize, so Derick's approach was not really working for me. There were several reasons which I don't want to explain here. But I came was this:

I created a default template called with loading indicator and spinner, which I attach to template of the view. I have a method called updateView, which is triggered once the model syncs and replaces the loading template with real template and calls render() afterwards.

Maybe someone will also find it useful.

var myView = new MyView({
     template: loader,
     initialize : function(){
        this.model = new MyModel();
        this.model.on("sync", this.updateView, this);
        this.model.fetch();
     },
     updateView : function(){
        this.template = myTemplate;
        this.render();
     }
});

Answer 2

You can wait until the model is sync'd before rendering the view

var myView = new MyView({
  model: myModel
});

myModel.on("sync", function(){
  myRegion.show(myView);
});

myModel.fetch();