骨幹Js設置模板屬性

Question

我認爲這應該是安靜的容易，但不知何故我無法弄清楚這是如何工作的。

我在骨幹JS，我想這要放在不同的位置2個模板，但使用相同的Backbone.View

HTML

<script type="text/template" id="tmpl1"> 
<div> template 1 </div> 
</script> 

<script type="text/template" id="tmpl2"> 
<div> template 2 </div> 
</script> 

<div id="firstDiv"></div> 

Next Template 

<div id="secondDiv"></div> 

JS

TmplView = Backbone.View.extend({ 
    initialize: function(){ 
     this.render(); 
    }, 
    render: function(){ 
     var template = _.template(this.$el.html(), {}); 
     this.container.append(template); 
    }, 
    container: $("#firstDiv"), 
}); 

var template1 = new TmplView({ el: $("#tmpl1") }); 
var template2 = new TmplView({ el: $("#tmpl2") }); 

我的問題： 如何將template2設置爲容器$("#secondDiv")？

我試圖var template2 = new TmplView({ el: $("#tmpl2"), container: $("#secondDiv") });

請讓我知道常見的方式這樣做。

謝謝

Answer 1

我用以下解決方案解決了這個問題：

TmplView = Backbone.View.extend({ 
    initialize: function(){ 
     this.render(); 
    }, 
    render: function(){ 
     console.log(this.$el); 
     var template = _.template(this.$el[0].html(), {}); 
     this.$el[1].append(template); 
    }, 
}); 

var template1 = new TmplView({ el: [$("#tmpl1"), $("#firstDiv") ] }); 
var template2 = new TmplView({ el: [$("#tmpl2"), $("#secondDiv") ] }); 

如果有人可能有一個更好的方法，這將是受歡迎的。

Answer 2

試試這個：

TmplView = Backbone.View.extend({ 
initialize: function(){ 
    this.render(); 
}, 
render: function(){ 
    var template = _.template(this.template, {}); 
    this.$el.append(template); 
} 
}); 

var template1 = new TmplView({ el: "#firstDiv", template : $('#tmpl1').html() }); 
var template2 = new TmplView({ el: "#secondDiv", template : $('#tmpl2').html() });