EmberJSの折りたたみ可能なサイドバー要素

Question

私は音楽のジャンルとサブジャンルからなるサイドバーとして機能したいと思うリストがあります。

<ul> 
    {{#each model as |genre|}} 
    <li> 
     {{#link-to "listen.genre" genre}} 
     {{genre.title}} 
     {{/link-to}} 
     <ul> 
     {{#each genre.subgenre as |subgenre|}} 
      {{#link-to "listen.genre.subgenre" genre subgenre}}<li>{{subgenre.title}}</li>{{/link-to}} 
     {{/each}} 
     </ul> 
    </li> 
    {{/each}} 
</ul> 

私の難しさは、選択したジャンルのみにサブジャンルを表示する方法を考え出すことです。私は何らかの形で適切なジャンルに 'アクティブな'クラスを加えることができれば、うまくいくCSSのビットを持っています。

li ul { 
    display: none; 
} 

li.active ul { 
    display: block; 
} 

Answer 1

これにはember-cli-active-link-wrapperを使用できます。私は、このようなものをember自体に実装するRFCがあると思います。