如何在Node.js Express中使用Handlebars和JSON？

Question

我有一个JSON数据存在dataList变量中，我想将其作为参数添加到自定义handlebars helper中。

var dataList = [
  {
    "id": 1,
    "title": "Arrange meeting",
    "date": "Today 10:35 | By Admin",
    "completed": true
  },
];

Handlebars自定义助手

var Handlebar = require('handlebars');
Handlebar.registerHelper('List', function(data, options){
  //console.log(data) //returns undefined 
  return options.fn(JSON.parse(data)); // gives error
});

自定义帮助器渲染：

{{#List dataList}} 
  {{> widgets/toDoList}}
{{/List}}

它产生了错误

语法错误：JSON 中的位置 0 处有意外的 u 标记

然而，它可以使用静态数据正常工作。

{{#List '[
  {
    "id": 1,
    "title": "Arrange meeting",
    "date": "Today 10:35 | By Admin",
    "completed": true
  },
]' }} 
  {{> widgets/toDoList}}
{{/List}}

- Varinder Sohal

---

当我在{{#List full_json_code_here}}中使用单引号添加完整的JSON代码时，它可以完美地工作。你能解释一下吗？或者最好在问题中添加用例，说明它何时起作用。 - Raghav Garg

@RaghavGarg 问题已更新。 - Varinder Sohal

感谢您的更新，我非常确定这不是自定义帮助程序的问题，而是您传递数据的方式。请还要展示您在哪里调用了此视图！！如果您正在使用Express，那么它应该像这样：res.render('view-name', data)。 - Raghav Garg

谢谢！@RaghavGarg 它可以工作。 - Varinder Sohal

Answer 1

我很确定，这不是自定义助手的问题，而是您传递数据的方式。如果您正在使用express，则会像这样： res.render('view-name', data)

- Raghav Garg

Answer 2

JSON.parse接受一个字符串，但你传递给它一个数组

- VyorreL

Answer 3

这是因为你的data返回了undefined，请参考[未捕获的语法错误：意外的令牌U JSON]以获取更多信息。

- Jignesh Sanghani

---

JSON dataList已经被定义，但仍然无法获得实际问题。 - Varinder Sohal

//console.log(data) //returns undefined return options.fn(JSON.parse(data)); });``` 在这段代码中，您已将数据解析为JSON格式，但由于数据未定义，因此出现了此错误。 - Jignesh Sanghani

好的！那你能解释一下如何定义 dataList 吗？在 {{#List dataList }} 中。 {{> widgets/toDoList}} {{/List}} - Varinder Sohal

你玩过Handlebars吗？这里有一个教程（视频）：[https://www.youtube.com/watch?v=4HuAnM6b2d8] - Jignesh Sanghani

@JigneshSanghani，为什么你把问题重述成答案了呢？原帖中已经告诉我们数据是“未定义”的，因此出现错误。请帮助找出为什么会出现“未定义”。。！ - Raghav Garg