如何识别页面集合中的当前页面

如何识别页面集合中的当前页面

本文介绍了如何识别页面集合中的当前页面?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Grunt的Assemble.io配置静态站点生成器。我使用Pages Collection来建立一个如下的导航列表:

  {{#each pages}} 
< li>< a href ={{filename}}}> {{{title}}}< / a>< / li>
{{/ each}}

我也想申请 class =active添加到当前页面的导航项中,但我不确定如何处理。我的第一个想法是尝试比较集合的当前迭代的标题和正在呈现的页面的标题,但这有两个问题:


  1. 如果 helper在handlebars中似乎没有办法比较两个表达式。我可以编写一个自定义帮助程序,但是我想在尝试之前知道这是最好的方法。

  2. 我不知道如何区分当前集合迭代的标题和当前页面的标题。据我所知,它们都被简称为 title 。

如何确定页面集合循环何时在正在呈现的当前页面上运行? 使用解析方案

助手。


I'm configuring a static site generator using Grunt's Assemble.io. I'm using the Pages Collection to build a navigation list like so:

{{#each pages }}
    <li><a href="{{{filename}} }">{{{title}} }</a></li>
{{/each }}

I would also like to apply class="active" to the navigation item for the current page, but I'm not sure how to approach this. My first thought was to try comparing the title of the current iteration of the collection to that of the page being rendered, but this has two problems:

  1. The if helper in handlebars doesn't seem to have a way to compare two expressions. I could write a custom helper, but I would want to know this is the best way before I try it.
  2. I don't know how to distinguish between the title of the current collection iteration and that of the current page. They would both be referred to as simply title as far as I can tell.

How can I determine when the pages collection loop is operating on the page which is the current page being rendered?

解决方案

Use isCurrentPage

{{#each pages }}
<li{{#if this.isCurrentPage}} class="active"{{/if}}>
    <a href="{{{filename}} }">{{{title}} }</a>
</li>
{{/each }}

Alternatively, you can use isActive helper.

这篇关于如何识别页面集合中的当前页面?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-05 14:07