我有一个无序列表,我试图在其中一个订单项附加一些链接。
我也在尝试连接每个订单项的链接,以及我在丢失的技术示例后面的行项目中放置的每个链接.http://lostechies.com/derickbailey / 2011/10/11 /骨架JS-得到最模型换一个-点击的元件/
我将一个视图调用另一个视图以保持模型连接到链接。
我无法弄清楚的是我将this.el
与ItemMatch
视图的结果相关联,那么为什么我的html会结束
<ul> <li> list-item called this.el </li> <a href="#"> first item </a> <a href="#"> second item </a> <a href="#"> third item </a> </>
MyApp.Views.ItemList = Backbone.View.extend({ tagname: 'li', classname:'item_list', ... render_item_match: function(model){ var item_match = new MyApp.Views.ItemMatch({model:model}); $(this.el).append(item_match.el); } }); MyApp.Views.ItemMatch = Backbone.View.extend({ tagname: 'a', classname: 'item_match_result', initialize: function(){ _.bindAll(this,"item_match_result"); this.render(); }, events : { "click a.item_result": "item_match_result" }, render : function(){ this.el = HandlebarsTemplates['items/itemSearchResultItem'](this.model.attributes); }, item_match_result: function(){ console.log(this); } }); })
答案 0 :(得分:2)
tagname
和classname
?尝试使用tagName
和className
这样的事情很好:
MyApp = {Views:{}};
MyApp.Views.ItemList = Backbone.View.extend({
tagName: 'li',
className:'item_list',
//....
initialize : function() {
$('body').append($('<ul></ul>'))
this.render();
},
render: function(){
$('ul').append($(this.el));
this.render_item_match();
},
render_item_match: function(model){
var item_match = new MyApp.Views.ItemMatch({model:model});
$(this.el).append(item_match.el);
}
});
MyApp.Views.ItemMatch = Backbone.View.extend({
tagName: 'a',
className: 'item_match_result',
initialize: function(){
_.bindAll(this,"item_match_result");
this.render();
},
events : {
"click a.item_result": "item_match_result"
},
render : function(){
this.el = _.template('<a href="#">testLink</a>');
},
item_match_result: function(){
console.log(this);
}
});
new MyApp.Views.ItemList();
<强>输出:强>
<ul><li class="item_list"><a href="#">testLink</a></li></ul>