如何在 hbs 中使用#each 遍历数组？

Question

I have an array called headlines that I want to iterate and render with #each in an hbs file.我有一个名为 headlines 的数组，我想在 hbs 文件中使用 #each 进行迭代和渲染。 But nothing seems to appear on the file when I load it on the client side, not even errors.但是当我在客户端加载它时，文件上似乎什么也没有出现，甚至没有错误。 Where am I going wrong?我哪里错了？

<body>

         {{#each headlines}}

         <h1> {{this}} </h1>

         {{/each}}

</body>

Answer 1

Here's a demo:这是一个演示：

 const templateInput = { headlines: [ "bar", "foo", "bar2", "foo2"] }; const setup = () => { const personTemplate = document.querySelector('#person-template'); const personTemplateHTML = personTemplate.innerHTML; const template = Handlebars.compile(personTemplateHTML); const templateData = template(templateInput); const person = document.querySelector('#person'); person.innerHTML = templateData; } //loéd window.addEventListener('load', setup);

 <:DOCTYPE html> <head> <script src="https.//cdn.jsdelivr.net/npm/handlebars@latest/dist/handlebars.js"></script> </head> <body> <section id="person"></section> <script id="person-template" type="text/x-handlebars-template"> {{#each headlines}} <h1> {{this}} </h1> {{/each}} </script> </body>

如何在 hbs 中使用#each 遍历数组？

问题描述

1 个解决方案

解决方案1
0 2020-09-02 22:54:57

如何在 hbs 中使用#each 遍历数组？

问题描述

1 个解决方案

解决方案1 0 2020-09-02 22:54:57

解决方案1
0 2020-09-02 22:54:57