Come aggiornare i dati dopo il recupero del modello nel modello di Handlebars con Backbone e Marionette?

Question

Provare ad avere un campo dati in un aggiornamento del modello di Handlebars dopo che è stato recuperato il modello assegnato a Marionette CompositeView, ma l'HTML nella pagina non viene aggiornato.

Il mio codice è simile al seguente:

Modello:

B.Page.Model = Backbone.Model.extend({ 
    url: function() { 
     return 'my/resource/'; 
    }, 
}); 

Vista:

B.Page.CompositeView = Backbone.Marionette.CompositeView.extend({ 
    template: Handlebars.compile(templates.find('#my-template').html()), 

    initialize: function(options) { 
     _.bindAll(this); 
     this.model.fetch(); 
    }, 
)}; 

Template:

<script id="my-template" type="text/x-handlebars-template"> 
    Date: <span id="my-data-field">{{data}}</span> 
</script> 

Ho controllato la risorsa e lo fa tornare corretta JSON con il set data campo. Inoltre, il modello viene passato alla vista.

Sospetto che ciò sia dovuto al fatto che la funzione render non viene chiamata dopo che i dati sono stati recuperati; tuttavia, vorrei ricevere un feedback su come dovrebbe essere fatto.

Qual è un buon modo per farlo?

Grazie!

EDIT: questo oggetto CompositeView dispone di una raccolta associata (che viene visualizzata correttamente quando si attiva l'evento appropriato). Ho intenzionalmente omesso quella parte del codice per evitare di confondere il problema.

Answer 1

Hai ragione, dal momento che uno CompositeView si estende da CollectionView, per impostazione predefinita esegue nuovamente il rendering sugli eventi di raccolta. Per rendere più ri-renderizzare sui cambiamenti del modello, si potrebbe fare qualcosa di simile nel tuo CompositeView:

initialize: function(){ 
    this.listenTo(this.model, "change", this.render); 
} 

Answer 2

vista Tutto Marionette hanno un oggetto modelEvents che è legato al passato di modello. Così si potrebbe pulire la risposta accettata leggermente facendo:

template: Handlebars.compile(templates.find('#my-template').html()), 

modelEvents: { 
    'change': 'render' 
} 

piuttosto che vincolanti manualmente inizializzazione.