Render a Marionette region after model has been fetched

问题

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 will report his solution here:

 MyView = Backbone.View.extend({
  initialize: function(){
    this.model.on("sync", this.render, this);
  },

  render: function(){ ... }
});


myModel = new MyModel({id: someId});
new MyView({
  model: myModel
});

myModel.fetch();

I have a slightly different situation: my view is inside a region layout. If I call the Marionette.Region.show() it works but the view is rendered twice. Calling Marionette.Region.attachView() the view render's function is called once but the content is not displayed in the page.

Any idea?

回答1:

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();

回答2:

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();
     }
});

来源：https://stackoverflow.com/questions/15497763/render-a-marionette-region-after-model-has-been-fetched

标签

javascript

backbone.js

marionette