我刚开始使用 Backbone，我的目标是一个简单的幻灯片应用程序。我有一个 REST 接口(interface)，其中
/slidecasts
获取所有可用演示文稿的列表。返回的 json 如下所示:
[
{
"name": "p75-barth.pdf",
"nr": 1,
"slideLinks": [
"slides/0",
"slides/1",
]
}]
如果我想访问单个演示文稿并获取例如第一张幻灯片，我可以简单地执行以下操作:
slidecasts/1/slides
返回:
[
{
"content": null,
"imageLinks": [
"images/1"
],
"nr": 0,
"title": null
}
]
我想将演示文稿和幻灯片表示为主干模型。我还想要一个主干 View ，它最终只显示一张幻灯片图像、标题、一些注释和一个前进/后退按钮。
到目前为止，这是我的代码:
$(function (){
initModel();
initCollection();
initView();
var testSlidecast = new Slidecast();
testSlidecast.id=1;
testSlide = new Slide();
testSlide.id = 5;
testSlidecast.Slide = testSlide;
var slideView = new SlideView(({model: testSlidecast}));
})
function initView(){
SlideView = Backbone.View.extend({
el: $("#presentation"),
initialize: function(){
this.render();
alert("asd")
},
render: function(){
var variables = { presentation_name: "This is a Test-Slide-Name" };
var template = _.template( $("#slide_template").html(), {} );
this.el.html( template );
}
});
}
function initModel(){
Slide = Backbone.Model.extend({
});
}
function initCollection(){
Slidecast = Backbone.Collection.extend({
model: Slide,
url: function(){
return 'slidecasts/' + this.id + '/slides'
}
});
}
这适用于集合，但我真的不知道如何从那里获取单个幻灯片的信息。像 slidecast.slide("0") 这样的东西可能吗？
我在 View 模板方面也有一些问题:
我的 html 看起来像这样:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<link href="style.css" rel="stylesheet"/>
<script src="http://underscorejs.org/underscore-min.js" > </script>
<script src="http://code.jquery.com/jquery-1.7.2.min.js" > </script>
<script src="http://backbonejs.org/backbone-min.js" > </script>
<script src="bscript.js" > </script>
</head>
<body>
<div id="presentation"> </div>
<script type="text/template" id="slide_template">
<label>Presentation <%= presentation_name %> </label>
<img src="" id="slide_pic" />
<input type="text" id="slide_content" value="asd" />
</script>
</body>
</html>
尽管我已经在 View 中定义了变量，但我一直收到错误消息，即我想传递给我的模板 *presentation_name* 的变量名称未定义。
最佳答案
模板范围内的变量必须显式传递。模板不会自动访问 View 范围内的变量。而不是:
var template = _.template( $("#slide_template").html(), {} );
尝试
var template = _.template( $("#slide_template").html(), variables);
关于javascript - Backbone + Underscore : Can't find Template Variable. + 如何正确访问模型属性？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10769926/