javascript 传递模型对象以在主干中查看
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19609627/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
passing model object to view in backbone
提问by tawheed
I have been trying to pass a model object to be evaluated in my template but had no luck. I tried the following but had no luck
我一直试图在我的模板中传递要评估的模型对象，但没有运气。我尝试了以下但没有运气
dashboardmodel.js
仪表板模型.js
var myMod = Backbone.Model.extend({
defaults: {
name: "mo",
age: "10"
}
});
myview.js
myview.js
var dashView = Backbone.View.extend({
el: '.content-area',
this.mymodel = new myMod({}),
template: _.template(dashBoardTemplate, this.mymodel),
initialize: function() {
},
render: function() {
this.$el.html(this.template);
return this;
}
// more javascript code.............
dahboard.html
仪表盘.html
<p> Hello <%= name %> </p>
PS: I am using the underscore template engine
PS：我使用的是下划线模板引擎
采纳答案by nemesv
You need to get properties of a Backbone Model with the getter syntax, so you need to rewrite your template to:
您需要使用 getter 语法获取 Backbone 模型的属性，因此您需要将模板重写为：
<p> Hello <%= obj.get('name') %> </p>
Or you need to convert your model into a plain JS object when calling _.templatewhat you can do with the .toJSON()(which creates a clone of the model) or .attributesproperty:
或者，您需要在调用_.template您可以使用.toJSON()（创建模型的克隆）或.attributes属性执行的操作时将模型转换为普通的 JS 对象：
template: _.template(dashBoardTemplate, this.mymodel.toJSON())
Side note: you should consider to move the template rendering logic into your view. Because your current code render your template when your view is declared and not when you call the rendermethod. So you might get unexpected result. So your code you look like this:
旁注：您应该考虑将模板渲染逻辑移到您的视图中。因为您当前的代码在声明您的视图时呈现您的模板，而不是在您调用该render方法时。所以你可能会得到意想不到的结果。所以你的代码看起来像这样：
template: _.template(dashBoardTemplate), //only compile the template
render: function() {
this.$el.html(this.template(this.mymodel.toJSON()));
return this;
}
回答by chfw
In addition , your way to pass a model to a view is not flexible, because you would pass an instance of your model, instead of a default model. Thus, you might want to single out
此外，您将模型传递给视图的方式并不灵活，因为您将传递模型的实例，而不是默认模型。因此，你可能想挑出
this.mymodel = new myMod({}),
(btw, above line gives me error message in my chrome browser because of "=" sign)
（顺便说一句，由于“=”符号，上面的行在我的 chrome 浏览器中给了我错误消息）
Then, suppose you have an instance A:
然后，假设您有一个实例 A：
A = new myMod({"name": "World", "age":100})
Then pass it to your view as:
然后将其传递给您的视图：
myview = new dashView({mymodel: A})
One more step, you have to do is to call render function:
还有一步，你要做的是调用渲染函数：
myview.render();
Here's a complete solution:
这是一个完整的解决方案：
<html>
<script src="jquery-1.10.2.min.js"></script>
<script src="underscore-min.js"></script>
<script src="backbone.js"></script>
<body>
<script type="text/template" id="dashBoardTemplate">
<p> Hello <%= name %> </p>
</script>
<div class="content-area">
</div>
<script type="text/javascript">
var myMod = Backbone.Model.extend({
defaults: {
name: "mo",
age: "10"
}
});
var dashView = Backbone.View.extend({
el: '.content-area',
template: _.template($("#dashBoardTemplate").html()),
render: function() {
this.$el.html(this.template(this.model.toJSON()));
return this;
}
});
mymod = new myMod({"name": "World", "age":100});
myview = new dashView({model:mymod});
myview.render();
</script>
</body>
</html>
If you want to study backone.js, please read this open source book which get me started:
如果你想学习 backone.js，请阅读这本让我入门的开源书籍：
