javascript - 使用前端 javascript 更改 Handlebars 变量值

Question

我的目标是使用前端 JavaScript 文件更改 handlebars 变量的值。

后端 JavaScript (app.js)

res.render('index', { name: 'John' })

.hbs文件

<button id="name" onclick="changeName()">{{name}}</button>

script.js(前端)

const changeName = () => {
// Change the value of {{name}} from 'John' to 'Bob'
}

我知道你可以用:

const changeName = () => {
document.getElementById('name').innerHTML = 'Bob'
}

但我特别想更改 handlebars 变量值，因为在我的实际代码中它有点复杂。

谢谢!

Answer 1

查看Block helpers handlebars ，在您的情况下，您可以创建一个帮助程序来更改 name 变量，如下所示:

.hbs

<div class="entry">
<h1>{{title}}</h1>
 <div class="name">
  {{#nameHelper}}{{name}}{{/nameHelper}}
 </div>
</div>

脚本.js

Handlebars.registerHelper('nameHelper', function(options) {
return new Handlebars.SafeString(
  '<div class="name">'
  + options.fn(otherName)
  + '</div>');
});