javascript - Ember.js という名前のアウトレットがクリック時にのみ表示されるようにする

Question

@intuitivepixel のおかげで、サブナビはほぼ正常に動作しています。問題は、ルートをロードすると、サブナビがすでに表示されていることです。サブナビゲーションは「about」セクションの一部にすぎません。メインのナビゲーションは次のとおりです。

about   conditions   programs   testimonials

アプリのルートであるインデックスでは、表示したいリンクはこれらだけです。しかし、「about」をクリックすると、サブナビゲーションがメインナビゲーションのすぐ下に表示され、「about」がアクティブに設定され、利用可能なサブリンクが次のように設定されます。

philosophy    leadership    staff    affiliations

最後に、「哲学」をクリックすると、哲学テンプレートが読み込まれますが、「概要」ナビゲーションはまだアクティブであり、「哲学」ナビゲーションがアクティブになります。

アプリケーション.hbs:

<div class="row left-nav">
{{#linkTo "index"}}<img class="ew_logo" src="assets/ew.png">{{/linkTo}}
</div>
<div class="row nav">
<div class="large-12 colummns">
    <ul class="inline-list top-nav">
            <li><h6>{{#linkTo "subnav"}}ABOUT{{/linkTo}}</h6></li>
            <li><h6>//</h6></li>
            <li><h6>CONDITIONS</h6></li>
            <li><h6>//</h6></li>
            <li><h6>PROGRAMS</h6><li>
            <li><h6>//</h6></li>
            <li><h6>TESTIMONIALS</h6></li>
    </ul>
</div>
</div>
<div class="row subnav">
    <div class="large-12 colummns">
        {{outlet 'subnav'}}
    </div>
</div>
{{outlet}}

application_route.coffee:

Ew.ApplicationRoute = Ember.Route.extend(renderTemplate: ->
  @render() 
  # this renders the application template per se
  # and this additional call renders the subnav template into the named outlet
  @render "subnav", #the name of your template
    outlet: "subnav" #the name of the named outlet
    into: "application" #the name of the template where the named outlet should be rendered into
)

ありがとうございました！

編集

また、「about」をクリックしたときに「subnav」が URL に表示されないようにすることも追加する必要があります。質問ばかりですみません。たくさんのjqueryをハッキングせずにこれを行う方法があるかどうか、ただ興味があります.