余烬失去活跃的踪迹

Ember losing active trail

本文关键字:活跃 失去 余烬      更新时间:2023-09-26

嗨,我在余烬中有以下路线:

App.Router.map(function(){
    this.resource('meat', function() {
        this.resource('poultry', function() {
            this.route('chicken');
            this.route('duck');
        });
    });
});

我的模板如下所示:

<script type='text/x-handlebars' id='meat'>       
     <div>{{outlet}}</div>
</script>

<script type='text/x-handlebars' id='poultry'>
       Poultry
       <br/><br/>
          {{#link-to 'poultry.chicken'}}Chicken{{/link-to}}
          {{#link-to 'poultry.duck'}}Duck{{/link-to}}
      <br/><br/>
      <div>
         {{outlet}}
      </div>
</script>
<script type="text/x-handlebars" id="poultry/chicken">
    <h4>Chicken</h4>
</script>
<script type="text/x-handlebars" id="poultry/duck">
    <h4>Duck</h4>
</script>

问题是,当我点击"鸭子"链接时,我失去了"家禽"的活动轨迹。

我想不通,路径是正确的,但是活动类消失了。

这是一个jsbin:http://emberjs.jsbin.com/yularepare/2/

谢谢!

注释中的代码与 JSBin 略有不同。未包含应用程序模板。在这里:

<script type='text/x-handlebars' data-template-name='application'>
  {{#link-to 'poultry.chicken' }}Poultry{{/link-to}}  
  <br/><br/>
  <div>
    {{outlet}}
  </div>
</script>

你正在失去active类,因为你直接链接到'poultry.chicken',而不是'poultry'。它不是父路由,而是同级路由。如果要保留活动类,请将link-to更改为:

{{#link-to 'poultry'}}Poultry{{/link-to}}

它应该工作正常。工作JSBin:http://jsbin.com/fefucalaqi/1/edit

编辑:评论询问如何处理重定向到第一个结果。在此处添加。

App.PoultryIndexRoute = Ember.Route.extend({
  redirect: function() {
    // write some code to get to your first result here.
    this.transitionTo('poultry.chicken');
  }
});

现在,您将获得两者:所有家禽路线上的活动类,如果没有选择,则将显示第一个。