使用主干视图为模板添加下划线
Underscore templates with Backbone view
我在将主干集合传递给 HTML 中的下划线模板时遇到问题。现在在模板代码中<%=teamCollection%>是未定义的。teamCollection 是我想从 Backbone 视图传递到模板中的主干集合。
下面是模板代码:
<script id="user-home-main-table-template" type="text/template">
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Team Name</th>
<th>Club</th>
<th>Sport</th>
<th>Delete?</th>
</tr>
</thead>
<tbody>
<%
<!--console.log(<%=teamCollection%>);
var teams = <%=teamCollection%>;
console.log(teams);-->
for(var i=0; i
<teams.length
; i++) { %>
<!-- <tr onclick=window.document.location='/users/<%=user._id%>/teams/<%= teams[i]._id%>/teamDashboard'>-->
<tr>
<td>
<%=i+1%>
</td>
<td >
<a class="font-big" href='/users/<%=user._id%>/teams/<%= teams[i]._id%>/teamDashboard'>
<%= teams[i].teamName %>
</a>
</td>
<td>
<a class="font-big" href='/users/<%=user._id%>/teams/<%= teams[i]._id%>/teamDashboard'>
<%= teams[i].club %>
</a>
</td>
<td>
<a class="font-big" href='/users/<%=user._id%>/teams/<%= teams[i]._id%>/teamDashboard'>
<%= teams[i].sport %>
</a>
</td>
<td>
<a class="btn btn-warning" onclick=window.userHomeMainTableView.deleteTeam('<%=teams[i]._id%>');>delete</a>
</td>
</tr>
<% } %>
</tbody>
</table>
</script>
这是骨干代码:
var Team = Backbone.Model.extend({
idAttribute: "_id",
urlRoot: '/api/teams'
});
var TeamCollection = Backbone.Collection.extend({
model: Team
});
var teamCollection = new TeamCollection([]);
var UserHomeMainTableView = Backbone.View.extend({
tagName: "div",
collection: teamCollection,
events: {},
initialize: function () {
this.render();
},
render: function() {
//this.template = _.template($('#tmpl').html());
var userHomeMainTableTemplate = document.getElementById('user-home-main-table-template').innerHTML;
var template = _.template(userHomeMainTableTemplate);
//this.$el.html(_.template(userHomeMainTableTemplate)());
this.$el.html(template({teamCollection:teamCollection}));
console.log('userHomeMainTableTemplate rendered');
return this;
},
addTeam: function (teamData) {
console.log('adding team:', team_id);
}
});
这是一个与这个问题相对应的 JSFiddle,我显然也无法开始工作:http://jsfiddle.net/the1mills/26dkh5wa/
teamCollection
在模板中未定义,因为teamCollection
在javascript代码中未定义。我在您的代码中找不到声明或teamCollection
.
相关文章:
- 如何在结果中添加下划线但不添加虚假值的情况下进行映射
- Javascript Regexp :如果一个字母与一个数字相邻,请添加下划线
- 如何在 javascript 中为字符串中的数字添加下划线
- 以编程方式添加 href 时缺少铬锚点下划线
- 将回调函数添加到下划线 _.invoke
- 使用主干视图为模板添加下划线
- 下划线.js,从一个对象中获取两个项目并添加到顶部
- 为单行添加下划线可将集合转换为对象的对象
- 使用 jQuery 为某些单词添加下划线
- 我的 h1 标签链接在悬停时会显示一个下划线,我没有添加
- 如何将动态添加的锚标记添加到下划线模板
- 如何添加带有下划线 js 的计算属性
- 下划线 _.每个不向对象元素添加属性
- 下划线模板,将列表添加到单个数组中
- 为字符串中的某些字符添加下划线
- Joomla组件自动添加下划线
- javascript查找第n个引用并在其前面添加下划线
- 在导航菜单中为过渡添加下划线
- 如何在MeanJS中添加下划线模块
- 使用主干为模板添加下划线