爲什麼這個骨幹視圖不能正確渲染？

我在backbone.js有幾個意見，我想要成爲另一個孩子。所以我創建了下面的代碼。爲什麼這個骨幹視圖不能正確渲染？

var app = app || {} ; 

app.ProjectCardView = Backbone.View.extend({ 

    el: $('.list'), 

    template: _.template($("#tpl-project-card-summary").html()), 


    initialize: function() { 
     this.render(); 
    }, 

    render: function() { 
     return this.$el.html(this.template()); 

    } 

}); 


app.DashboardView = Backbone.View.extend({ 

    el: $('.contentwrap'), 

    template: _.template($("#tpl-dashboard").html()), 

    initialize: function() { 
     this.render(); 
     this.addProjects(); 
    }, 

    render: function() { 
     //console.log(this.template()); 
     this.$el.html(this.template()); 

    }, 

    addProjects: function() { 
     var pcv = new app.ProjectCardView();  
    } 



}); 

app.dash = new app.DashboardView;

的DashboardView呈現完美的，但是當我創建了ProjectCardView，認爲似乎沒有初始化，因此模板是空的，EL未設置。如果我在初始化函數中設置了el，那麼$ el仍然沒有設置。我只是看不到我做錯了什麼。

編輯：看起來像我發現問題; $（'。list'）是第一個視圖引入的元素，因此，第二個視圖試圖找到它時不會呈現 - 即使第一個視圖已在DOM中呈現。

那麼我該如何解決這個問題？

來源

2013-03-07 Stevo

您可以發佈您的模板？ – nemesv 2013-03-07 20:43:05

我寧願不 - 即使我刪除模板，它仍然無法正確啓動。 – Stevo 2013-03-07 20:44:16

沒有看到你的html很難提供幫助...你可以嘗試將你的ProjectCardView的el從'el：$（'。list'），''改爲'el：'.list'，' – nemesv 2013-03-07 20:46:52

如果你指定你的el作爲jQuery選擇器$('.list')你應該知道它會在你的Backbone.View.extend執行時執行。所以，如果你的元素不在DOM中，那麼你的選擇器將不起作用。

因此，您需要在DOM中指定el。所以你的情況，你可以這樣寫：

addProjects: function() { 
    var pcv = new app.ProjectCardView({ el: $('.list') });  
}

或者你也可以使用骨幹功能，您可以指定el作爲jQuery選擇的字符串istead：

app.ProjectCardView = Backbone.View.extend({  
    el: '.list', 
    //... 
}

來源

2013-03-07 21:02:23 nemesv

爲什麼這個骨幹視圖不能正確渲染？

回答

相關問題