définir dynamiquement Classname sur la vue Backbone rendent

Question

J'ai vue Backbone où le nom de classe est réglé de manière dynamique avec une fonction:

app.Views.ItemRequestView = Backbone.View.extend({ 

    tagName  : 'tr', 

    className : function(){ 

     var classRow = ''; 

     if(this.model.getState() == app.Models.Request.status.wait.key) { 
      classRow = app.Models.Request.status.wait.color + ' bolder'; 
     } 
     else if(this.model.getState() == app.Models.Request.status.confirm.key){ 
      classRow = app.Models.Request.status.confirm.color + ' bolder'; 
     } 

     return classRow; 
    }, 

Lorsque je mets à jour le modèle de la vue je déclenche un événement de changement qui rend la vue . Le problème est que className n'est pas recalculer avec le rendu ... Comment puis-je recalculer le className lorsque je rends la vue?

Quelqu'un a une idée? Merci

Answer 1

Vous devrez mettre à jour votre class manuellement après la méthode render. Backbone initialise le className de l'élément de votre vue une seule fois le temps au cours de la méthode _ensureElement:

_ensureElement: function() { 
     if (!this.el) { 
     var attrs = _.extend({}, _.result(this, 'attributes')); 
     if (this.id) attrs.id = _.result(this, 'id'); 
     if (this.className) attrs['class'] = _.result(this, 'className'); 
     var $el = Backbone.$('<' + _.result(this, 'tagName') + '>').attr(attrs); 
     this.setElement($el, false); 
     } else { 
     this.setElement(_.result(this, 'el'), false); 
     } 
} 

Si vous jetez un coup d'oeil, il a un contrôle en cas de l'élément existe déjà. Quoi qu'il en soit, vous pouvez le faire manuellement dans votre méthode render:

render: function(){ 
    //Your logic 
    this.$el.attr('class', _.result(this, 'className')); 
}