2013-03-07 9 views
1

Je passe une collection et un modèle à mon avis:vue Backbone pas peuplant

popModel = new GenreModel({genre_name:'Pop',genre_id:'pop'}); 
popView = new GenreView ({model:popModel,collection:new PopCol()}); 

Ceci est la mise en œuvre de la vue:

Backbone.View.extend ({ 
    className:'sect', 

    initialize: function() 
    { 
     context = this; 
     this.collection.fetch ({ 
      success:function() 
      { 
       context.render(); 
      } 
     });  
    }, 

    render: function() 
    { 
     console.log("hello"); 
     this.$el.html (_.template(view,this.model.toJSON())); 
     this.collection.each (function (video) 
     { 
      genreLi = new GenreLi ({model:video}); 
      this.$(this.model.genre_id).append (genreLi.el); 
     },this); 

     return this; 
    }, 

}); 

Mon problème est que quand je l'appelle console. log (popView.el) Je reçois le suivant:

<div class="sect"></div> 
hello 

la vue ne peuplait mais quand je l'appelle console.log (popView. render.el) Je reçois:

hello 
<div class=​"sect">​…​</div>​ 
hello 

La vue s'affiche alors correctement.Comment puis-je résoudre ce problème?

+0

Pouvez-vous nous donner un violon avec lequel travailler? –

Répondre

1

Je suppose que vous essayez d'afficher toutes les vidéos du même genre dans une liste ul ul. Je pense qu'il vous manque le '#' avant l'identifiant lors de l'obtention de l'élément.

render: function() 
{ 
    ... 
    this.collection.each (function (video) 
    { 
     genreLi = new GenreLi ({model:video}); 
     // if you have already defined elements by genre id and not within the view's el 
     // This is not good as a view should attach new html into dom elements under it 
     $('#'+this.model.genre_id).append (genreLi.el); 

     // if you have defined elements by genre id within in the view'w el then 
     this.$el.find('#'+this.model.genre_id).append (genreLi.el); 

    },this); 

    return this; 
},