Backbone - View not update page

Question

Я пытаюсь использовать функцию render в вопросеListView, и она работает, но не обновляет страницу.

Шаблон:

<script id="myTemplate" type="text/template"> 
<p>Test</p> 
</script> 

Часть JS:

$(function(){ 

//Test data 
var initialListData = [ 
    { listName: "Sample Questions", listID: 1}, 
    { listName: "Default questions", listID: 2} 
]; 

// MODELS ---------------------------------------------------- 
var questionList = Backbone.Model.extend({ 
    defaults: { 
     listName: "Name of the list", 
     listID: 0 
    } 
}); 

// COLLECTIONS ---------------------------------------------------- 
var populateList = Backbone.Collection.extend({ 
    model: questionList 
}); 

// VIEWS ---------------------------------------------------- 
var questionListView = Backbone.View.extend({ 
    template: $("#myTemplate").html(), 
    render: function() { 
     console.log('I can see this, but nothing happens...'); 
     var tmpl = _.template(this.template);    
     $(this.el).append(tmpl(this.model.toJSON())); 
     return this; 
    } 
}); 


var AppView = Backbone.View.extend({ 
    el : $("#content"), 
    initialize: function(){ 
     this.collection=new populateList(initialListData); 
     this.render(); 
    }, 
    render: function(){ 
     _.each(this.collection.models, function (item) { 
      this.renderSelect(item); 
     }, this); 
    }, 
    renderSelect: function(item){ 
     var populateQuestionList = new questionListView({ 
      model: item 
     }); 
     this.$el.append(populateQuestionList.render().el); 
    } 
}); 

var app = new AppView(); 

} (jQuery)); 

Спасибо!

Answer 1

Вы запускаете это в обратном вызове события document.ready? Если нет, ваш код может выполняться до того, как DOM будет загружен и готов. Попробуйте:

$(function() { 
    var app = new AppView(); 
}); 

Несколько разных точек.

• Вы можете сделать template: _.template($("#myTemplate").html()) кэшировать шаблон функции как микро-оптимизации
• Вы можете использовать this.$el вместо $(this.el) в последней версии позвоночнике. Вы уже делаете это в одном месте, но не в обоих.