Question

在 handlebars-helper inArray 块助手中引用来自 handlebars 的每个助手的 'this'

2018-02-16

918

node.js handlebars.js

我正在使用 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)

我不太明白发生了什么，我怀疑它在 inArray 块助手中使用 this 时遇到了问题 - 它可能没有看到底层字符串？

Answer 1

作为替代方法，您可以考虑编写自己的自定义“Handlebars Helper”，如下所示：

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

Or an optimised way

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

Alternative answer

经楼主确认，真正的问题是由于数组访问不正确。正确的代码是，

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