Gezinme menü öğesi Kısmen Gidişler bölümünde etkin kılın Kısmi

Question

Şu anda, her bir sekmede gezinme menümdeki kodumu yineliyorum, ancak kısmi kod kullanmak istiyorum, böylece çoğaltılmış kod yok.

Bu, dosyaya bağlı olarak farklı bir liste öğesindeki active sınıfı ile (aşağıda) kullanıyorum. Bunun yerine, bir kısmi {{> fruits-nav}} kullanmak istiyorum, ancak hangi dosyanın kısmi dahil olduğuna bağlı olarak active sınıfını nasıl ayarlayacağım hakkında hiçbir bilgi bulamıyorum.

<div id="table-nav-tabs"> 
    <ul class="nav nav-tabs"> 
     <li class="apple"><a href="{{id}}">apple</a></li> 
     <li class="active orange"><a href="{{id}}">orange</a></li> 
     <li class="mango"><a href="{{id}}">mango</a></li> 
     <li class="pineapple"><a href="{{id}}">pineapple</a></li> 
    </ul> 
</div> 

Answer 1

sen bunu yapabilirsiniz böylece kısmi veri iletmek edebilirsiniz kısmi:

{{> fruits-nav active}} 

ve sadece emin active olun: daha sonra

<div id="table-nav-tabs"> 
    <ul class="nav nav-tabs"> 
     <li class="{{#if active_apple}}active{{/if}} apple"><a href="{{id}}">apple</a></li> 
     <li class="{{#if active_orange}}active{{/if}} orange"><a href="{{id}}">orange</a></li> 
     <li class="{{#if active_mango}}active{{/if}} mango"><a href="{{id}}">mango</a></li> 
     <li class="{{#if active_pineapple}}active{{/if}} pineapple"><a href="{{id}}">pineapple</a></li> 
    </ul> 
</div> 

ve şu şekilde çekmek Mevcut meyve için uygun bayrağı ayarladı.

Demo: render ederken

<div id="table-nav-tabs"> 
    <ul class="nav nav-tabs"> 
     <li class="{{#if active.apple}}active{{/if}} apple"><a href="{{id}}">apple</a></li> 
     <li class="{{#if active.orange}}active{{/if}} orange"><a href="{{id}}">orange</a></li> 
     <li class="{{#if active.mango}}active{{/if}} mango"><a href="{{id}}">mango</a></li> 
     <li class="{{#if active.pineapple}}active{{/if}} pineapple"><a href="{{id}}">pineapple</a></li> 
    </ul> 
</div> 

ve: http://jsfiddle.net/ambiguous/GesND/

Answer 2

ben bile biraz daha basit ve daha okunabilir hale düşünüyorum

active: { pineapple: true }