如何使用underscore.js输出JSON对象？

Question

我将使用underscore.js模板库来配合我的backbone示例。我的模板看起来像这样：

<script id="results-template" type="text/template">
    <h2><%= title %></h2>
</script>

JSON对象的样式如下所示：

{"src":"placeholder.jpg","title":"an image placeholder","coordinates":[0,0],"tags":["untagged"],"location":"home"}

我试图通过模板解析此对象，但是我的控制台显示以下错误：

Uncaught ReferenceError: title is not defined

我做错了什么？这里是在线演示链接：http://jsfiddle.net/amit_e/muLjV/46/

需要翻译的内容已经完成翻译，您还有其他需要翻译的吗？

- Amit Erandole

Answer 1

您的问题是：

JSON.stringify(myPhoto)

这需要进行

myPhoto.toJSON()

原因：您的 JSON.stringify() 会将整个 myPhoto 模型作为 Json 字符串输出。现在，Backbone 有一个将 json 输出为 json 对象 的函数，因此您可以使用 model.toJSON()。

更新后的 jsfiddle： http://jsfiddle.net/saelfaer/muLjV/50/

- Sander

---

我混淆了两个JSON函数。所以你的意思是myPhoto.toJSON()将对象传递给模板，但stringify函数不会这样做？ - Amit Erandole

我是说，myPhoto.toJSON()返回一个JSON对象，而JSON.stringify返回一个字符串。请查看此jsfiddle以查看差异。http://jsfiddle.net/saelfaer/muLjV/55/（记得检查控制台，在结果窗口中没有输出）。 - Sander

Answer 2

如果您只想显示标题，那么不需要处理整个Photo模型的JSON。您只需检索单个属性即可。

以下渲染将满足此处的需求。

render: function(event){
  var yourOutput={title:myPhoto.get('title')};
  var compiled_template = _.template( $("#results-template").html(),yourOutput);
    this.el.html(compiled_template);        
}

您当前的JSON对象如下。它并不复杂，您可以轻松获取任何标题、src、坐标、标签和位置。

{
    "src": "placeholder.jpg",
    "title": "an image placeholder",
    "coordinates": [0,0],
    "tags": ["untagged"],
    "location": "home"
}

- Umesh Patil

---

不知道您是否可以在 JSON 文档中间评估一个表达式。那么这个 {title:myPhoto.get('title')} 可以工作吗？ - Amit Erandole

以上已经回答了！你可以使用类似上面的代码获取任何标题、src、坐标、标签、位置。你会发现JSON方法非常有效。你可以使用它 :) - Umesh Patil