2014-02-07 50 views
2

我正在使用Grunt的Assemble.io配置静态站点生成器。我使用Pages集合建立像这样一个导航列表:如何识别页面集合中的当前页面?

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

我也想申请class="active"到当前页面的导航项目,但我不知道如何处理这一点。我首先想到的是尝试比较集合当前迭代的页面的标题渲染,但有两个问题:

  1. if帮手车把似乎并未有办法比较两个表达式。我可以编写一个自定义帮助程序,但我想在尝试之前知道这是最好的方法。
  2. 我不知道如何区分当前集合迭代的title和当前页面的title。据我所知,他们都被简称为title

如何确定何时页面集合循环在当前正在呈现的页面的页面上进行操作?

回答

3

使用isCurrentPage

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

或者,你可以使用isActive帮手。

+0

我已经实现了一个解决方案,使用'is'帮助器将'data.title'与页面的'title'进行比较,但是这更清晰。谢谢! – raddevon

+1

fwiw,'this'不需要。在这种情况下,除非您使用与助手同名的变量,并且您需要告诉把手如何区分这两者,否则'this'从不是必需的。 – jonschlinkert

相关问题