handlebars.js – Handlebars:通过href将信息从页面传输到另一个页面

让我们在Handlebars中说我们有这个cards-list.html部分:
{{#each data}}

<article class="card card_list-view card_list-view--regular">
<picture class="card-image">
    <img src="{{root}}/assets/img/{{this.img}}" alt="">
</picture>
<section class="card-section">
    <header>
        <h3><a href="{{this.url}}">{{this.title}}</a></h3>
    </header>
</section>
</article>

{{/each}}

数据是这样的:

{"id": "1","title": "A","img": "imga.jpg","url": "card-single.html"
},{"id": "2","title": "B","img": "imgb.jpg","url": "card-single.html"
}

并且 – 在card-single.html中 – 我想简单地使用以下内容呈现单张卡片:

<article class="card card_single-view">
  <h4>{{title}}</h4}
  [etc..]

我如何通过href属性或其他方式将cards-list.html的原始上下文传递给card-single.html?

谢谢!

解决方法

使用Handlebars.registerPartial创建部分后,您可以将其包含在模板中,如下所示:
{{> cardSingle }}

此语法还接受对象参数:

{{> cardSingle objectOfThings }}

所以在你的cards-list.html中你可能有类似的东西:

{{#each data}}
    {{> cardSingle this }}
{{/each}}

而你的cardSingle部分可以直接使用这个属性

<h4>{{title}}</h4>

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...