我正在使用backbone.js,
我有一个格式如下的模型:
{
username:"name",
id:"1",
picture:"image.jpg"
}
我希望有这样的观点:
<div id="1">
<span class="name">name<span>
<img src="image.jpg" />
</div>
来自此模板:
<script type="text/template" id="users-template">
<span class="name"><%= username %></span>
<img src="<%= image %>" />
</script>
但是当我将用户ID放入views id属性时,我会陷入困境。
UserView = Backbone.View.extend({
id: this.model.id, //this is what I have tried but it doesnt work
initialize: function(){
this.template = _.template($('#users-template').html());
},
render: function(){
...
}
})
有谁知道如何将当前模型id放入id属性?
答案 0 :(得分:5)
我用那个
id : function () {
return this.model.get("id");
}
U只能使用".get()"
获取模型的数据如果要等到将值定义到运行时,也可以将tagName,id,className,el和events等属性定义为函数。 @from Backbonejs.org
答案 1 :(得分:3)
首先,您的模型有picture
,但您的模板使用image
,它们应该相同,否则您的模板会出现“遗失变量”错误。
视图上的id
属性应该是现有元素的DOM id
; Backbone不会将其添加到el
,Backbone使用它来查找 el
。此外,this
执行id: this.model.id
时不会是一个视图(this
可能是window
或其他一些无用的东西)而且model
属性不是无论如何都要设置直到视图被实例化。
根据视图的
tagName
,className
,id
和属性属性创建(如果已指定)。如果没有, el 为空div
。
请从视图中删除id
,然后使用<div>
的默认el
。然后,在render
方法中,您可以在id
上设置this.el
属性;此外,使用数字id
属性会导致某些浏览器出现问题,因此您通常应在id
前面加上非数字的前缀:
render: function() {
this.el.id = 'v' + this.model.get('id');
this.$el.append(this.template(this.model.toJSON()));
return this;
}
演示:http://jsfiddle.net/ambiguous/ZBE5z/
在运行演示时打开控制台,您将能够在视图this.el
中看到最终的HTML。
答案 2 :(得分:0)
这是因为最初执行JavaScript时未设置模型。试试这个:
initialize: function(){
this.id = this.model.id;
this.template = _.template($('#users-template').html());
},