使用前端更改车把变量值 javascript

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，在你的情况下，你可以创建一个帮助程序来更改名称变量，如下所示：

.hbs

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

script.js

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

使用前端更改车把变量值 javascript

Change handlebars variable value using front end javascript

javascript

node.js

handlebars.js