javascript - 为 keystonejs 中的局部变量赋值

Question

在keystonejs(一个 Node cms)中，我使用handlebars作为keystonejs中的模板引擎。在 Handlebars 文件中，我使用 #each 来迭代数组。

 {{#each data.positions}}
      <h1 onclick = "callFunction()"> {{title}} </h1>
 {{/each}}

这里我想调用路由内的函数，我该怎么做？

我想到的另一种方法是初始化局部变量。就像我在路由文件中有一个变量 locals.selectedPositionIndex 一样，我想在单击任何 h1 元素时将特定 h1 元素的 @index 值分配给该变量。

Answer 1

您可以在 Handlebars 模板底部包含一个脚本，并在其中包含该函数:

<script>
  document.querySelector('h1').addEventListener('click', function() {
    // Code here
  })
</script>

或者，这里有一个问题和一个有用的答案: Passing a function into a Handlebars template

我已经修改了上述问题的答案以与 KeystoneJS 一起使用:

在您看来，您可以将您的职能分配给本地人:

locals.func = function () {
  // Code here
};

然后您需要在/templates/views/helpers/index.js中创建一个Handlebars助手:

_helpers.stringifyFunc = function(fn) {
  return new hbs.SafeString("(" + fn.toString().replace(/\"/g,"'") + ")()");
};

然后您可以在 Handlebars 模板中使用它:

<h1 onclick="{{ stringifyFunc func }}">{{ title }}</h1>

我希望这会有所帮助。