Javascript Handlebars.js 解析对象而不是 [Object object]
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10232574/
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
Handlebars.js parse object instead of [Object object]
提问by dzm
I'm using Handlebars templates and JSON data is already represented in [Object object], how do I parse this data outside of the Handlebars? For example, I'm trying to populate a JavaScript variable on the page through a handlebars tag, but this doesn't work.
我正在使用 Handlebars 模板并且 JSON 数据已经在 [Object object] 中表示，我如何在 Handlebars 之外解析这些数据？例如，我试图通过 handlebars 标记在页面上填充 JavaScript 变量，但这不起作用。
Any suggestions? Thank you!
有什么建议？谢谢！
EDIT:
编辑：
To clarify, I'm using ExpressJS w/ Handlebars for templating. In my route, I have this:
澄清一下，我使用 ExpressJS w/ Handlebars 进行模板化。在我的路线中，我有这个：
var user = {}
user = {'id' : 123, 'name' : 'First Name'}
res.render('index', {user : user});
Then in my index.hbs template, I now have a {{user}}object. I can use {{#each}}to iterate through the object just fine. However, I'm also using Backbonejs and I want to pass this data to a View, such as this:
然后在我的 index.hbs 模板中，我现在有一个{{user}}对象。我可以{{#each}}用来遍历对象就好了。但是，我也在使用 Backbonejs，我想将此数据传递给视图，例如：
myView = new myView({user : {{user}});
myView = new myView({user : {{user}});
The problem, is that {{user}}simply shows [Object object]in the source if I put it in console.log I get an error, 'Unexpected Identifier'.
问题是，如果我把它放在 console.log 中，它{{user}}只是[Object object]在源代码中显示，我得到一个错误，“意外的标识符”。
回答by Jonathan Lonowski
When outputting {{user}}, Handlebars will first retrieve the user's .toString()value. For plain Objects, the default result of this is the "[object Object]"you're seeing.
输出时{{user}}，Handlebars 将首先检索user的.toString()值。对于普通Objects，其默认结果是"[object Object]"您所看到的。
To get something more useful, you'll either want to display a specific property of the object:
为了获得更有用的东西，您要么想要显示对象的特定属性：
{{user.id}}
{{user.name}}
Or, you can use/define a helper to format the object differently:
或者，您可以使用/定义一个助手来以不同的方式格式化对象：
Handlebars.registerHelper('json', function(context) {
return JSON.stringify(context);
});
myView = new myView({
user : {{{json user}}} // note triple brackets to disable HTML encoding
});
回答by nguyên
You can simple stringifythe JSON:
您可以简单地将 JSON字符串化：
var user = {}
user = {'id' : 123, 'name' : 'First Name'};
// for print
user.stringify = JSON.stringify(user);
Then in template print by:
然后在模板中打印：
{{{user.stringify}}};
回答by Jeff Lowery
I'm using server-side templating in node-js, but this may apply client-side as well. I register Jonathan's json helper in node. In my handler, I add context (such as addressBook) via res.locals. Then I can store the context variable client-side as follows:
我在 node-js 中使用服务器端模板，但这也可能适用于客户端。我在 node.js 中注册了Jonathan的 json 助手。在我的处理程序中，我通过 res.locals 添加上下文（例如 addressBook）。然后我可以在客户端存储上下文变量，如下所示：
<script>
{{#if addressBook}}
console.log("addressBook:", {{{json addressBook}}});
window.addressBook = {{{json addressBook}}};
{{/if}}
</script>
Note the triple curlies (as pointed out by Jim Liu).
注意三重卷曲（正如Jim Liu指出的那样）。
回答by Terry
You are trying to pass templating syntax {{ }}inside a JSON object which is not valid.
您正在尝试在{{ }}无效的 JSON 对象中传递模板语法。
You may need to do this instead:
您可能需要这样做：
myView = new myView({ user : user });
myView = new myView({ user : user });
回答by Phil C
If you want more control over the output formatting you can write your own helper. This one has a recursive function to traverse nested objects.
如果您想更多地控制输出格式，您可以编写自己的助手。这个有一个递归函数来遍历嵌套对象。
Handlebars.registerHelper('objToList', function(context) {
function toList(obj, indent) {
var res=""
for (var k in obj) {
if (obj[k] instanceof Object) {
res=res+k+"\n"+toList(obj[k], (" " + indent)) ;
}
else{
res=res+indent+k+" : "+obj[k]+"\n";
}
}
return res;
}
return toList(context,"");
});
We used handlebars for email templates and this proved useful for a user like the following
我们在电子邮件模板中使用了把手，事实证明这对以下用户很有用
{
"user": {
"id": 123,
"name": "First Name",
"account": {
"bank": "Wells Fargo",
"sort code": " 123-456"
}
}
}
