我在理解如何使用模板在视图中渲染集合时遇到问题。这是我的代码:
<div id="mydiv"></div>
<script type="text/template" id="details">
<ul>
<% _.each(?, function(person) { %>
<li><%= person.name %></li>
<% }); %>
</ul>
</script>
<script>
var m = Backbone.Model.extend();
var c = Backbone.Collection.extend({
url: 'retrieve.php',
model: m
});
var v = Backbone.View.extend({
el : $('#mydiv'),
template : _.template($("#details").html()),
initialize : function() {
var coll = new c();
coll.fetch({success: function(){alert(JSON.stringify(coll));} });
this.render();
},
render : function() {
//what do I put here?
return this;
}
});
var view = new v();
我对如何将从 php 文件返回的数据获取到模板中感到困惑。视图和 ._each 中需要什么代码?我的 php 代码返回:
[{"id":"1","name":"John","age":"5"},{"id":"2","name":"Jane","age":"2"}]
我在alert()中看到了这一点。
你应该打电话给你的render
函数从success
处理程序作为collection.fetch
异步返回结果(您也可以bind http://backbonejs.org/#Events-listenTo render
集合函数reset
event).
var v = Backbone.View.extend({
el : '#mydiv',
template : _.template($("#details").html()),
initialize : function() {
var self = this,
coll = new c();
coll.fetch({ success: function(){ self.render() ; } });
},
render : function() {
// the persons will be "visible" in your template
this.$el.html(this.template({ persons: this.coll.toJSON() }));
return this;
}
});
并在模板中引用相同的内容persons
object
<script type="text/template" id="details">
<ul>
<% _.each(persons, function(person) { %>
<li><%= person.name %></li>
<% }); %>
</ul>
</script>
Update:
我已经创建了工作fiddle http://jsfiddle.net/superhacker/P2JR8/3/,但我不得不修改原始源代码,因为我不能使用你的retrieve.php
终点
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)