Question

我正在使用Node.js，express，handlebars和handlebars-helpers。

使用res.render()时，我将两个对象传递给Handlebars模板，对象如下：

var searchParams = {a: ['Apples']}
var searchFields = {a: ['Apples', 'Pears', 'Oranges']}

然后，我希望使用searchFields在页面上创建复选框。当复选框变量在相应的searchParams变量中时，我希望默认情况下选中复选框。

我正在尝试使用handlebars-helpers辅助函数inArray来使用模板中的以下内容实现此目的：

<form>
{{#each searchFields.a}}
<label>
<input name="only_a_test" value="{{this}}" type="checkbox" 
  {{#inArray searchParams.a this}}
  checked
  {{else}}
  {{/inArray}}
  >
{{this}}
</label>
{{/each}}
</form>

然而，这会引发错误：

无法读取未定义的属性“长度”

TypeError: .../web/views/search.hbs: Cannot read property 'length' of undefined
    at Object.indexOf (.../web/node_modules/handlebars-utils/index.js:82:31)
    at String.helpers.inArray (.../web/node_modules/handlebars-helpers/lib/array.js:225:26)
    at eval (eval at createFunctionContext (.../web/node_modules/handlebars/dist/cjs/handlebars/compiler/javascript-compiler.js:254:23), <anonymous>:10:91)
    at Object.prog [as inverse] (.../web/node_modules/handlebars/dist/cjs/handlebars/runtime.js:219:12)
    at Object.utils.value (.../web/node_modules/handlebars-utils/index.js:237:50)
    at String.helpers.eq (.../web/node_modules/handlebars-helpers/lib/comparison.js:170:15)
    at eval (eval at createFunctionContext (.../web/node_modules/handlebars/dist/cjs/handlebars/compiler/javascript-compiler.js:254:23), <anonymous>:5:84)
    at prog (.../web/node_modules/handlebars/dist/cjs/handlebars/runtime.js:219:12)
    at execIteration (.../web/node_modules/handlebars/dist/cjs/handlebars/helpers/each.js:51:19)
    at Object.<anonymous> (.../web/node_modules/handlebars/dist/cjs/handlebars/helpers/each.js:61:13)

我无法理解正在发生的事情，我怀疑它在this块助手中使用inArray时遇到问题 - 它可能没有看到底层字符串？

Answer 1

作为替代方法，您可以考虑编写自己的自定义'Handlebars 帮手'如下，

Handlebars.registerHelper("isInArray", function(array, value) {
  if (array.indexOf(value) != -1) {
    return "checked";
  }
});

或优化方式

Handlebars.registerHelper("isInArray", function(array, value) {
  return array.indexOf(value) != -1 ? 'checked' : '';
});

并在模板文件中将其称为

<input name="only_a_test" value="{{this}}" type="checkbox" {{isInArray ../b this}}>

PEN。希望这会有所帮助。

Answer 2

替代答案

正如OP所证实的，真正的问题是由于数组被错误地访问。正确的代码是，

{{#inArray ../searchParams.a this}}

从把手中引用'this'，把手中的每个助手 - 助手inArray block helper

2 个答案: