將數組傳遞給 Handlebars 自定義助手

Question

我正在嘗試使用express-handlebars將一組數據傳遞給自定義助手。 我無法讓它工作。

我可以傳入一個字符串，也可以將一個數組傳遞給單個視圖，但我似乎無法將數組傳遞給自定義助手。 這是我的代碼：

傳遞給自定義助手的字符串（這有效）

// app.js
const hbs = expressHandlebars.create({
  extname: 'html',
  helpers: {
    foo: function () {
      return 'FOO!'
    }
})

// views/layout/main.html
<h2>{{ foo }}</h2>

// Result --> FOO! outputed as expected

將數組傳遞給單個視圖（這也有效）

// controllers/pageControllers.js
exports.getIndexPage = (req, res) => {
  res.render('index', {
    testList: ['one', 'two', 'three']
  })
}

// views/index.html
{{#each testList}}
<div>{{this}}</div>
{{/each}}

// Result --> one, two, three outputted as expected

數組傳遞給自定義助手（這不起作用）

// app.js
const hbs = expressHandlebars.create({
  extname: 'html',
  helpers: {
    testList2: function () {
      return ['one', 'two', 'three']
    },
  }
})

// views/layout/main.html
{{#each testList2}}
  <div>{{this}}</div>
{{/each}}

// Result --> NOTHING.  No output, no error messages.

自定義助手不帶 arrays 嗎？ 相同的代碼適用於單個視圖。 相同的代碼適用於自定義助手上的字符串。 它只是不適用於自定義助手上的數組。

如果自定義助手不接受 arrays，那么如何將一組數據放入我的主布局文件中？ 如果它確實需要一個數組，那么我做錯了什么以及如何讓它工作？

謝謝。

Answer 1

根據文檔#helpers ，-我自己沒有使用express-handlebars 。

Handlebars 助手調用是一個簡單的標識符，后跟零個或多個參數（用空格分隔）

這意味着您使用第一個標識符調用它，然后將對其進行評估。

助手只是接收數據並輸出一個經過處理的結果以注入到視圖中。

接收數據看起來像{{ foo exp1 exp2 }}轉換為{{foo(exp1,exp2)}}並且助手看起來像這樣。

 foo: function (exp1, exp2) {
      return `this is ${exp1} and ${exp2}`
    }

這就像調用常規 function。

在您的第一個示例中，您調用foo() （輔助函數），它什么都不接受，只輸出一個字符串，當激活時，您會得到返回值。

在您的第二個示例中，您使用 express 來呈現在視圖上可循環的變量。 與車把實例創建無關。 （您基本上是在創建一個快速res.locals.testList變量。）

在您的第三個示例中，您嘗試循環幫助程序 function 而不是真正調用它。 它試圖做這樣的事情：

for(let v of function() {}) {
 //...
}

這將給出錯誤（在你的情況下可能是沉默的） is not iterable

似乎您應該操作助手 function 中的數據數組，然后返回一個字符串或 html 字符串（使用 Z534F19BE86FF60EA96BBF80B90 文檔中提到的Handlebars.Safestring ）。 然后在您看來，只需將其稱為{{ testList2 }} ，它將為您嘗試執行的結構提供現成的HTML 。

希望這是有道理的。

話雖如此，文檔中提到了使用助手的更高級方法。 這可能更適合您嘗試做的任何事情。